463 lines
18 KiB
HTML
463 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<html manifest="cache.manifest">
|
||
|
||
<head>
|
||
<title>StackEdit中文版 – 浏览器内 Markdown 编辑器</title>
|
||
<link rel="canonical" href="https://edit.qicoder.com/">
|
||
<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="description"
|
||
content="Full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites.">
|
||
<meta name="author" content="Benoit Schweblin">
|
||
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
|
||
<meta name="msvalidate.01" content="5E47EE6F67B069C17E3CDD418351A612">
|
||
<meta name="google-site-verification" content="iWDn0T2r2_bDQWp_nW23MGePbO9X0M8wQSzbOU70pFQ" />
|
||
<link rel="stylesheet" href="https://edit.qicoder.com/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;
|
||
text-align: center;
|
||
width: 100%;
|
||
z-index: 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);
|
||
}
|
||
|
||
.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">
|
||
<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="splash-screen">
|
||
<div class="splash-screen__logo">
|
||
<div class="splash-screen__subtitle">
|
||
浏览器内 Markdown 编辑器
|
||
|
||
<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>
|
||
</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 可以将您的文件与 Google Drive、Dropbox 和 GitHub 同步。 它还可以将它们作为博客文章发布到 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>
|
||
Copyright 2013-2022 <a href="https://gitee.com/mafgwo" target="_blank">豆萁</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>
|
||
</body>
|
||
|
||
</html>
|