mirror of
https://gitee.com/mafgwo/stackedit
synced 2024-11-16 03:32:40 +08:00
540 lines
22 KiB
HTML
540 lines
22 KiB
HTML
<!DOCTYPE html>
|
||
<html manifest="cache.manifest">
|
||
|
||
<head>
|
||
<title>StackEdit中文版 – 浏览器内 Markdown 编辑器 & 笔记利器</title>
|
||
<link rel="canonical" href="https://stackedit.cn/">
|
||
<link rel="icon" href="static/landing/favicon.ico" type="image/x-icon">
|
||
<link rel="shortcut icon" href="static/landing/favicon.ico" type="image/x-icon">
|
||
<meta charset="UTF-8">
|
||
<meta name="keywords" content="Markdown编辑器,StackEdit中文版,StackEdit汉化版,StackEdit,在线Markdown,笔记利器,Markdown笔记">
|
||
<meta name="description"
|
||
content="支持直接将码云（Gitee）、GitHub、Gitea等仓库作为笔记存储仓库且支持拖拽/粘贴上传图片，并且可以直接在页面编辑同步和管理的Markdown编辑器。">
|
||
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
|
||
<meta name="baidu-site-verification" content="code-tGpn2BT069" />
|
||
<meta name="msvalidate.01" content="90A9558158543277BD284CFA054E7F5B" />
|
||
<link rel="stylesheet" href="https://stackedit.cn/style.css">
|
||
<style>
|
||
body {
|
||
background-color: #fbfbfb;
|
||
}
|
||
|
||
* {
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
h1 {
|
||
font-weight: 400;
|
||
text-align: center;
|
||
font-size: 2.5em;
|
||
margin: 2.5em 0;
|
||
}
|
||
|
||
h3 {
|
||
margin: 1em 0;
|
||
}
|
||
|
||
.button {
|
||
color: #555;
|
||
font-size: 20px;
|
||
background-color: transparent;
|
||
display: inline-block;
|
||
height: auto;
|
||
padding: 6px 12px;
|
||
margin: 0;
|
||
font-weight: 400;
|
||
line-height: 1.4;
|
||
text-transform: uppercase;
|
||
overflow: hidden;
|
||
text-align: center;
|
||
white-space: nowrap;
|
||
vertical-align: middle;
|
||
-ms-touch-action: manipulation;
|
||
touch-action: manipulation;
|
||
cursor: pointer;
|
||
-webkit-user-select: none;
|
||
-moz-user-select: none;
|
||
-ms-user-select: none;
|
||
user-select: none;
|
||
background-image: none;
|
||
border: 0;
|
||
border-radius: 2px;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.button:active,
|
||
.button:focus,
|
||
.button:hover {
|
||
color: #333;
|
||
background-color: rgba(0, 0, 0, 0.05);
|
||
outline: 0;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.icon {
|
||
width: 100%;
|
||
height: 100%;
|
||
display: inline;
|
||
}
|
||
|
||
.icon * {
|
||
fill: currentColor;
|
||
}
|
||
|
||
.button .icon {
|
||
height: 30px;
|
||
width: 30px;
|
||
margin: -6px 6px -6px 0;
|
||
}
|
||
|
||
.row {
|
||
margin: 8em 0;
|
||
}
|
||
|
||
.row::after {
|
||
display: block;
|
||
content: '';
|
||
clear: both;
|
||
}
|
||
|
||
@media (min-width: 700px) {
|
||
.column {
|
||
width: 50%;
|
||
float: right;
|
||
}
|
||
}
|
||
|
||
.landing {
|
||
position: absolute;
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.landing__content {
|
||
margin-left: auto;
|
||
margin-right: auto;
|
||
padding-left: 30px;
|
||
padding-right: 30px;
|
||
max-width: 1000px;
|
||
}
|
||
|
||
.landing__footer {
|
||
padding: 1em 0;
|
||
text-align: center;
|
||
background-color: #007acc;
|
||
color: rgba(255, 255, 255, 0.75);
|
||
font-size: 0.9em;
|
||
}
|
||
|
||
.landing__footer a {
|
||
color: #fff;
|
||
}
|
||
|
||
.navigation-bar {
|
||
background-color: #2c2c2c;
|
||
position: fixed;
|
||
padding: 5px;
|
||
width: 100%;
|
||
z-index: 1;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.navigation-bar__write {
|
||
text-align: center;
|
||
flex-grow: 1;
|
||
}
|
||
|
||
.navigation-bar__button {
|
||
color: #b9b9b9;
|
||
}
|
||
|
||
.navigation-bar__button:active,
|
||
.navigation-bar__button:focus,
|
||
.navigation-bar__button:hover {
|
||
color: #fff;
|
||
background-color: rgba(255, 255, 255, 0.1);
|
||
}
|
||
|
||
/* 语言切换样式 */
|
||
.navigation-bar__lang-switcher {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: auto;
|
||
font-size: 14px;
|
||
}
|
||
/* 隐藏下拉内容区域 */
|
||
.navigation-bar__dropdown-content {
|
||
display: none;
|
||
position: absolute;
|
||
z-index: 1;
|
||
}
|
||
|
||
/* 当鼠标悬停在按钮上时，显示下拉内容区域 */
|
||
.navigation-bar__dropdown:hover .navigation-bar__dropdown-content {
|
||
display: block;
|
||
}
|
||
|
||
/* 样式化下拉按钮 */
|
||
.navigation-bar__dropbtn {
|
||
background-color: #4CAF50;
|
||
color: white;
|
||
padding: 10px 16px;
|
||
font-size: 16px;
|
||
border: none;
|
||
cursor: pointer;
|
||
}
|
||
|
||
/* 样式化下拉选项 */
|
||
.navigation-bar__dropdown-content a {
|
||
color: black;
|
||
background-color: #f1f1f1;
|
||
padding: 12px 16px;
|
||
text-decoration: none;
|
||
display: block;
|
||
}
|
||
|
||
/* 当鼠标悬停在下拉选项上时，更改其背景颜色 */
|
||
.navigation-bar__dropdown-content a:hover {
|
||
background-color: #b2b2b2;
|
||
}
|
||
|
||
.splash-screen {
|
||
position: relative;
|
||
width: 100%;
|
||
height: 100%;
|
||
padding: 25px;
|
||
}
|
||
|
||
.splash-screen__logo {
|
||
width: 300px;
|
||
height: 150px;
|
||
position: absolute;
|
||
top: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
margin: auto;
|
||
background: no-repeat center url('static/landing/logo.svg');
|
||
background-size: contain;
|
||
}
|
||
|
||
@media (min-width: 700px) {
|
||
.splash-screen__logo {
|
||
width: 600px;
|
||
height: 160px;
|
||
}
|
||
}
|
||
|
||
.splash-screen__subtitle {
|
||
position: absolute;
|
||
text-align: center;
|
||
color: #777;
|
||
top: 95px;
|
||
right: 5px;
|
||
font-size: 16px;
|
||
}
|
||
|
||
@media (min-width: 700px) {
|
||
.splash-screen__subtitle {
|
||
text-align: right;
|
||
top: 125px;
|
||
font-size: 22px;
|
||
}
|
||
}
|
||
|
||
.splash-screen__footer {
|
||
position: absolute;
|
||
bottom: 25px;
|
||
left: 0;
|
||
width: 100%;
|
||
text-align: center;
|
||
}
|
||
|
||
.splash-screen__footer .button {
|
||
padding: 10px 20px;
|
||
}
|
||
|
||
.social {
|
||
margin: 0 5px;
|
||
}
|
||
|
||
.social a {
|
||
color: #555;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.social a:active,
|
||
.social a:focus,
|
||
.social a:hover {
|
||
color: #333;
|
||
outline: 0;
|
||
}
|
||
|
||
.landing__footer .social a {
|
||
color: rgba(255, 255, 255, 0.85);
|
||
}
|
||
|
||
.landing__footer .social a:active,
|
||
.landing__footer .social a:focus,
|
||
.landing__footer .social a:hover {
|
||
color: #fff;
|
||
}
|
||
|
||
|
||
.social .icon {
|
||
height: 30px;
|
||
width: 30px;
|
||
}
|
||
|
||
.feature {
|
||
padding: 5px 5px;
|
||
border-radius: 2px;
|
||
max-width: 350px;
|
||
margin: 1em auto;
|
||
text-align: center;
|
||
}
|
||
|
||
.image {
|
||
display: block;
|
||
margin: 1em auto;
|
||
border: 1px solid #eee;
|
||
border-radius: 2px;
|
||
background-color: #fff;
|
||
}
|
||
|
||
.image img {
|
||
display: block;
|
||
margin: 0.5em auto;
|
||
}
|
||
</style>
|
||
<script>
|
||
function scrollTo(selector) {
|
||
$('html,body').animate({scrollTop: $(selector).offset().top}, 500);
|
||
}
|
||
</script>
|
||
</head>
|
||
|
||
<body>
|
||
<div class="landing">
|
||
<div class="navigation-bar">
|
||
<div class="navigation-bar__write">
|
||
<a class="navigation-bar__button button" href="app" title="The app">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="icon"><path d="M 16.8363,2.73375C 16.45,2.73375 16.0688,2.88125 15.7712,3.17375L 13.6525,5.2925L 18.955,10.5962L 21.0737,8.47625C 21.665,7.89 21.665,6.94375 21.0737,6.3575L 17.895,3.17375C 17.6025,2.88125 17.2163,2.73375 16.8363,2.73375 Z M 12.9437,6.00125L 4.84375,14.1062L 7.4025,14.39L 7.57875,16.675L 9.85875,16.85L 10.1462,19.4088L 18.2475,11.3038M 4.2475,15.0437L 2.515,21.7337L 9.19875,19.9412L 8.955,17.7838L 6.645,17.6075L 6.465,15.2925"></path></svg>
|
||
开始写作
|
||
</a>
|
||
</div>
|
||
<div class="navigation-bar__lang-switcher">
|
||
<div class="navigation-bar__dropdown">
|
||
<button class="navigation-bar__dropbtn">Language</button>
|
||
<div class="navigation-bar__dropdown-content">
|
||
<a href="/">简体中文</a>
|
||
<a href="https://stackedit.net" target="_blank">English</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="splash-screen">
|
||
<div class="splash-screen__logo">
|
||
<div class="splash-screen__subtitle">
|
||
浏览器内 Markdown 笔记利器
|
||
|
||
<div class="social">
|
||
<a href="https://jq.qq.com/?_wv=1027&k=wUSCNqmN" target="_blank" title="QQ交流群">
|
||
<svg t="1665396466500" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3543" width="32" height="32">
|
||
<path d="M512 0C229.12 0 0 229.12 0 512c0 282.88 229.12 512 512 512s512-229.12 512-512C1024 229.12 794.88 0 512 0zM782.08 670.72c-11.52 6.4-30.72-7.68-48.64-34.56-6.4 28.16-24.32 53.76-48.64 74.24 25.6 8.96 42.24 25.6 42.24 42.24 0 29.44-46.08 52.48-102.4 52.48-51.2 0-93.44-19.2-101.12-43.52-2.56 0-10.24 0-12.8 0-7.68 24.32-49.92 43.52-101.12 43.52-56.32 0-102.4-23.04-102.4-52.48 0-17.92 16.64-33.28 42.24-42.24-24.32-20.48-42.24-46.08-48.64-74.24-17.92 25.6-37.12 39.68-48.64 34.56-17.92-8.96-14.08-57.6 7.68-107.52 16.64-39.68 39.68-69.12 57.6-75.52 0-2.56 0-5.12 0-7.68 0-15.36 3.84-29.44 11.52-40.96 0-1.28 0-1.28 0-2.56 0-7.68 1.28-14.08 5.12-19.2C340.48 312.32 408.32 230.4 518.4 230.4c110.08 0 177.92 81.92 183.04 185.6 2.56 5.12 5.12 12.8 5.12 19.2 0 1.28 0 1.28 0 2.56 7.68 11.52 11.52 25.6 11.52 40.96 0 2.56 0 5.12 0 7.68 17.92 6.4 40.96 35.84 57.6 75.52C796.16 613.12 800 661.76 782.08 670.72z" p-id="3544"></path>
|
||
</svg>
|
||
</a>
|
||
<a href="https://gitee.com/mafgwo/stackedit" target="_blank" title="码云开源仓库">
|
||
<svg t="1652950823759" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2991" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<defs><style type="text/css"></style></defs>
|
||
<path d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62 189.62 0 0 0-189.62 189.645V771.15c0 13.977 11.316 25.293 25.294 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z" fill="#C71D23" p-id="2992"></path>
|
||
</svg>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="splash-screen__footer">
|
||
<a class="button" href="javascript:scrollTo($('.anchor'))">
|
||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="icon"><path d="M 11,4L 13,4L 13,16.0104L 18.5052,10.5052L 19.9194,11.9194L 12,19.8388L 4.08058,11.9194L 5.49479,10.5052L 11,16.0104L 11,4 Z "/></path></svg>
|
||
阅读更多
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="anchor"></div>
|
||
<div class="landing__content">
|
||
<h1>无与伦比的写作体验</h1>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>丰富的 Markdown 编辑器</h3>
|
||
<p>StackEdit中文版 的 Markdown 语法高亮是独一无二的。 编辑器的精致文本格式可帮助您可视化文件的最终呈现。</p>
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<div class="image" style="width: 260px">
|
||
<img width="230" src="static/landing/syntax-highlighting.gif">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<img class="image" width="410" src="static/landing/navigation-bar.png">
|
||
<div class="feature">
|
||
<h3>所见即所得控件</h3>
|
||
<p>StackEdit中文版 提供了非常方便的格式化按钮和快捷方式，这要归功于 Stack Overflow 使用的所见即所得式 Markdown 编辑器 PageDown。</p>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>智能布局</h3>
|
||
<p>无论你是写作、阅读还是评论……StackEdit中文版的布局都为你提供了所需的灵活性。</p>
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<img class="image" width="360" src="static/landing/smart-layout.png">
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="feature">
|
||
<h3>滚动同步实时预览</h3>
|
||
<p>StackEdit中文版的滚动同步功能精确地绑定了编辑器面板和预览面板的滚动条，以确保您在编写时始终关注输出。</p>
|
||
</div>
|
||
<img class="image" width="485" src="static/landing/scroll-sync.gif">
|
||
</div>
|
||
<h1>专为网络写手设计</h1>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>保持同步</h3>
|
||
<p>StackEdit中文版 可以将您的文件与 Gitee、GitHub、Google Drive 和 Dropbox 同步。 它还可以将它们作为博客文章发布到 Blogger、WordPress 和 Zendesk。 您可以选择是以 Markdown 格式、HTML 上传，还是使用 Handlebars 模板引擎格式化输出。</p>
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<img class="image" width="300" src="static/landing/providers.png">
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>协作</h3>
|
||
<p>借助 StackEdit中文版，您可以共享协作文档空间，这要归功于同步机制。 如果两个协作者同时处理同一个文件，StackEdit中文版 会负责合并更改。</p>
|
||
</div>
|
||
<img class="image" width="300" src="static/landing/workspace.png">
|
||
</div>
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>评论</h3>
|
||
<p>StackEdit中文版 允许您在文件中插入内联评论和嵌入协作者讨论，就像 Microsoft Word 和 Google Docs 一样。</p>
|
||
</div>
|
||
<img class="image" width="395" src="static/landing/discussion.png">
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="feature">
|
||
<h3>离线写作！</h3>
|
||
<p>即使在旅行时，StackEdit中文版 仍然可以访问，让您可以像任何桌面应用程序一样离线编写。 你没有借口再偷懒！</p>
|
||
</div>
|
||
</div>
|
||
<h1>扩展的 Markdown 支持</h1>
|
||
<div class="row">
|
||
<div class="column">
|
||
<br>
|
||
<div class="image" style="width: 250px">
|
||
<img width="230" src="static/landing/gfm.png">
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>GitHub 风格的 Markdown</h3>
|
||
<p>StackEdit中文版 支持不同的 Markdown 风格，例如 Markdown Extra、GFM 和 CommonMark。 每个 Markdown 功能都可以在您方便的时候启用或禁用。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<br>
|
||
<div class="image" style="width: 270px">
|
||
<img width="250" src="static/landing/katex.gif">
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>LaTeX 数学表达式</h3>
|
||
<p>StackEdit中文版 从您的 Markdown 文件中的 LaTeX 表达式呈现数学公式。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="image" style="width: 300px">
|
||
<img width="280" src="static/landing/mermaid.gif">
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>UML 图</h3>
|
||
<p>StackEdit中文版 使您能够使用简单的语法编写序列图和流程图。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="image" style="width: 280px">
|
||
<img width="260" src="static/landing/abc.png">
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>乐谱</h3>
|
||
<p>StackEdit中文版 可以使用 ABC 表示法渲染乐谱。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<div class="image" style="width: 250px">
|
||
<img width="230" src="static/landing/twemoji.png">
|
||
</div>
|
||
</div>
|
||
<div class="column">
|
||
<div class="feature">
|
||
<h3>Emojis表情</h3>
|
||
<p>StackEdit中文版 支持使用 Markdown 表情符号标记在文件中插入表情符号。</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="landing__footer">
|
||
<div class="social">
|
||
<a href="https://gitee.com/mafgwo/stackedit" target="_blank">
|
||
<svg t="1652950823759" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2991" width="32" height="32" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<defs><style type="text/css"></style></defs>
|
||
<path d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62 189.62 0 0 0-189.62 189.645V771.15c0 13.977 11.316 25.293 25.294 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z" fill="#C71D23" p-id="2992"></path>
|
||
</svg>
|
||
</a>
|
||
</div>
|
||
<a href="app" title="The app">The app</a> – <a href="https://gitee.com/mafgwo/stackedit/issues" target="_blank" title="The app">Community</a><br>
|
||
© 2022 <a href="https://gitee.com/mafgwo" target="_blank">豆萁</a> <a href="https://beian.miit.gov.cn/" target="_blank">粤ICP备18096694号</a><br>
|
||
Licensed under an
|
||
<a target="_blank" href="http://www.apache.org/licenses/LICENSE-2.0">Apache License</a> –
|
||
<a href="privacy_policy.html" target="_blank">隐私策略</a>
|
||
</div>
|
||
</div>
|
||
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
|
||
|
||
<!-- built files will be auto injected -->
|
||
<script>
|
||
var _hmt = _hmt || [];
|
||
(function() {
|
||
var hm = document.createElement("script");
|
||
hm.src = "https://hm.baidu.com/hm.js?20a1e7a201b42702c49074c87a1f1035";
|
||
var s = document.getElementsByTagName("script")[0];
|
||
s.parentNode.insertBefore(hm, s);
|
||
})();
|
||
</script>
|
||
</body>
|
||
|
||
</html>
|