Compare commits
4 Commits
| Author | SHA1 | Date |
|---|---|---|
othree
|
6b9e8906ed | 7 years ago |
倪森
|
36fc46a053 | 7 years ago |
|
othree
|
147ed19d5b | 10 years ago |
Ｖ字龍(Vdragon)
|
fd617b5214 | 10 years ago |
19 changed files with 875 additions and 6236 deletions
@ -1,9 +0,0 @@
@@ -1,9 +0,0 @@
|
||||
all: index.html resources.html |
||||
.PHONY: all |
||||
|
||||
index.html: template.html syntax.md |
||||
cat template.html | perl -pe 's/\{\{\ *CONTENT\ *\}\}/`pandoc syntax.md`/ge' > index.html |
||||
|
||||
resources.html: template.html resources.md |
||||
cat template.html | perl -pe 's/\{\{\ *CONTENT\ *\}\}/`pandoc resources.md`/ge' > resources.html |
||||
|
||||
@ -1,30 +0,0 @@
@@ -1,30 +0,0 @@
|
||||
Copyright (c) 2004, John Gruber |
||||
<http://daringfireball.net/> |
||||
All rights reserved. |
||||
|
||||
Redistribution and use in source and binary forms, with or without |
||||
modification, are permitted provided that the following conditions are |
||||
met: |
||||
|
||||
* Redistributions of source code must retain the above copyright notice, |
||||
this list of conditions and the following disclaimer. |
||||
|
||||
* Redistributions in binary form must reproduce the above copyright |
||||
notice, this list of conditions and the following disclaimer in the |
||||
documentation and/or other materials provided with the distribution. |
||||
|
||||
* Neither the name "Markdown" nor the names of its contributors may |
||||
be used to endorse or promote products derived from this software |
||||
without specific prior written permission. |
||||
|
||||
This software is provided by the copyright holders and contributors "as |
||||
is" and any express or implied warranties, including, but not limited |
||||
to, the implied warranties of merchantability and fitness for a |
||||
particular purpose are disclaimed. In no event shall the copyright owner |
||||
or contributors be liable for any direct, indirect, incidental, special, |
||||
exemplary, or consequential damages (including, but not limited to, |
||||
procurement of substitute goods or services; loss of use, data, or |
||||
profits; or business interruption) however caused and on any theory of |
||||
liability, whether in contract, strict liability, or tort (including |
||||
negligence or otherwise) arising in any way out of the use of this |
||||
software, even if advised of the possibility of such damage. |
||||
@ -1,341 +0,0 @@
@@ -1,341 +0,0 @@
|
||||
Markdown |
||||
======== |
||||
|
||||
Version 1.0.1 - Tue 14 Dec 2004 |
||||
|
||||
by John Gruber |
||||
<http://daringfireball.net/> |
||||
|
||||
|
||||
Introduction |
||||
------------ |
||||
|
||||
Markdown is a text-to-HTML conversion tool for web writers. Markdown |
||||
allows you to write using an easy-to-read, easy-to-write plain text |
||||
format, then convert it to structurally valid XHTML (or HTML). |
||||
|
||||
Thus, "Markdown" is two things: a plain text markup syntax, and a |
||||
software tool, written in Perl, that converts the plain text markup |
||||
to HTML. |
||||
|
||||
Markdown works both as a Movable Type plug-in and as a standalone Perl |
||||
script -- which means it can also be used as a text filter in BBEdit |
||||
(or any other application that supporst filters written in Perl). |
||||
|
||||
Full documentation of Markdown's syntax and configuration options is |
||||
available on the web: <http://daringfireball.net/projects/markdown/>. |
||||
(Note: this readme file is formatted in Markdown.) |
||||
|
||||
|
||||
|
||||
Installation and Requirements |
||||
----------------------------- |
||||
|
||||
Markdown requires Perl 5.6.0 or later. Welcome to the 21st Century. |
||||
Markdown also requires the standard Perl library module `Digest::MD5`. |
||||
|
||||
|
||||
### Movable Type ### |
||||
|
||||
Markdown works with Movable Type version 2.6 or later (including |
||||
MT 3.0 or later). |
||||
|
||||
1. Copy the "Markdown.pl" file into your Movable Type "plugins" |
||||
directory. The "plugins" directory should be in the same directory |
||||
as "mt.cgi"; if the "plugins" directory doesn't already exist, use |
||||
your FTP program to create it. Your installation should look like |
||||
this: |
||||
|
||||
(mt home)/plugins/Markdown.pl |
||||
|
||||
2. Once installed, Markdown will appear as an option in Movable Type's |
||||
Text Formatting pop-up menu. This is selectable on a per-post basis. |
||||
Markdown translates your posts to HTML when you publish; the posts |
||||
themselves are stored in your MT database in Markdown format. |
||||
|
||||
3. If you also install SmartyPants 1.5 (or later), Markdown will offer |
||||
a second text formatting option: "Markdown with SmartyPants". This |
||||
option is the same as the regular "Markdown" formatter, except that |
||||
automatically uses SmartyPants to create typographically correct |
||||
curly quotes, em-dashes, and ellipses. See the SmartyPants web page |
||||
for more information: <http://daringfireball.net/projects/smartypants/> |
||||
|
||||
4. To make Markdown (or "Markdown with SmartyPants") your default |
||||
text formatting option for new posts, go to Weblog Config -> |
||||
Preferences. |
||||
|
||||
Note that by default, Markdown produces XHTML output. To configure |
||||
Markdown to produce HTML 4 output, see "Configuration", below. |
||||
|
||||
|
||||
### Blosxom ### |
||||
|
||||
Markdown works with Blosxom version 2.x. |
||||
|
||||
1. Rename the "Markdown.pl" plug-in to "Markdown" (case is |
||||
important). Movable Type requires plug-ins to have a ".pl" |
||||
extension; Blosxom forbids it. |
||||
|
||||
2. Copy the "Markdown" plug-in file to your Blosxom plug-ins folder. |
||||
If you're not sure where your Blosxom plug-ins folder is, see the |
||||
Blosxom documentation for information. |
||||
|
||||
3. That's it. The entries in your weblog will now automatically be |
||||
processed by Markdown. |
||||
|
||||
4. If you'd like to apply Markdown formatting only to certain posts, |
||||
rather than all of them, see Jason Clark's instructions for using |
||||
Markdown in conjunction with Blosxom's Meta plugin: |
||||
|
||||
<http://jclark.org/weblog/WebDev/Blosxom/Markdown.html> |
||||
|
||||
|
||||
### BBEdit ### |
||||
|
||||
Markdown works with BBEdit 6.1 or later on Mac OS X. (It also works |
||||
with BBEdit 5.1 or later and MacPerl 5.6.1 on Mac OS 8.6 or later.) |
||||
|
||||
1. Copy the "Markdown.pl" file to appropriate filters folder in your |
||||
"BBEdit Support" folder. On Mac OS X, this should be: |
||||
|
||||
BBEdit Support/Unix Support/Unix Filters/ |
||||
|
||||
See the BBEdit documentation for more details on the location of |
||||
these folders. |
||||
|
||||
You can rename "Markdown.pl" to whatever you wish. |
||||
|
||||
2. That's it. To use Markdown, select some text in a BBEdit document, |
||||
then choose Markdown from the Filters sub-menu in the "#!" menu, or |
||||
the Filters floating palette |
||||
|
||||
|
||||
|
||||
Configuration |
||||
------------- |
||||
|
||||
By default, Markdown produces XHTML output for tags with empty elements. |
||||
E.g.: |
||||
|
||||
<br /> |
||||
|
||||
Markdown can be configured to produce HTML-style tags; e.g.: |
||||
|
||||
<br> |
||||
|
||||
|
||||
### Movable Type ### |
||||
|
||||
You need to use a special `MTMarkdownOptions` container tag in each |
||||
Movable Type template where you want HTML 4-style output: |
||||
|
||||
<MTMarkdownOptions output='html4'> |
||||
... put your entry content here ... |
||||
</MTMarkdownOptions> |
||||
|
||||
The easiest way to use MTMarkdownOptions is probably to put the |
||||
opening tag right after your `<body>` tag, and the closing tag right |
||||
before `</body>`. |
||||
|
||||
To suppress Markdown processing in a particular template, i.e. to |
||||
publish the raw Markdown-formatted text without translation into |
||||
(X)HTML, set the `output` attribute to 'raw': |
||||
|
||||
<MTMarkdownOptions output='raw'> |
||||
... put your entry content here ... |
||||
</MTMarkdownOptions> |
||||
|
||||
|
||||
### Command-Line ### |
||||
|
||||
Use the `--html4tags` command-line switch to produce HTML output from a |
||||
Unix-style command line. E.g.: |
||||
|
||||
% perl Markdown.pl --html4tags foo.text |
||||
|
||||
Type `perldoc Markdown.pl`, or read the POD documentation within the |
||||
Markdown.pl source code for more information. |
||||
|
||||
|
||||
|
||||
Bugs |
||||
---- |
||||
|
||||
To file bug reports or feature requests please send email to: |
||||
<markdown@daringfireball.net>. |
||||
|
||||
|
||||
|
||||
Version History |
||||
--------------- |
||||
|
||||
1.0.1 (14 Dec 2004): |
||||
|
||||
+ Changed the syntax rules for code blocks and spans. Previously, |
||||
backslash escapes for special Markdown characters were processed |
||||
everywhere other than within inline HTML tags. Now, the contents |
||||
of code blocks and spans are no longer processed for backslash |
||||
escapes. This means that code blocks and spans are now treated |
||||
literally, with no special rules to worry about regarding |
||||
backslashes. |
||||
|
||||
**NOTE**: This changes the syntax from all previous versions of |
||||
Markdown. Code blocks and spans involving backslash characters |
||||
will now generate different output than before. |
||||
|
||||
+ Tweaked the rules for link definitions so that they must occur |
||||
within three spaces of the left margin. Thus if you indent a link |
||||
definition by four spaces or a tab, it will now be a code block. |
||||
|
||||
[a]: /url/ "Indented 3 spaces, this is a link def" |
||||
|
||||
[b]: /url/ "Indented 4 spaces, this is a code block" |
||||
|
||||
**IMPORTANT**: This may affect existing Markdown content if it |
||||
contains link definitions indented by 4 or more spaces. |
||||
|
||||
+ Added `>`, `+`, and `-` to the list of backslash-escapable |
||||
characters. These should have been done when these characters |
||||
were added as unordered list item markers. |
||||
|
||||
+ Trailing spaces and tabs following HTML comments and `<hr/>` tags |
||||
are now ignored. |
||||
|
||||
+ Inline links using `<` and `>` URL delimiters weren't working: |
||||
|
||||
like [this](<http://example.com/>) |
||||
|
||||
+ Added a bit of tolerance for trailing spaces and tabs after |
||||
Markdown hr's. |
||||
|
||||
+ Fixed bug where auto-links were being processed within code spans: |
||||
|
||||
like this: `<http://example.com/>` |
||||
|
||||
+ Sort-of fixed a bug where lines in the middle of hard-wrapped |
||||
paragraphs, which lines look like the start of a list item, |
||||
would accidentally trigger the creation of a list. E.g. a |
||||
paragraph that looked like this: |
||||
|
||||
I recommend upgrading to version |
||||
8. Oops, now this line is treated |
||||
as a sub-list. |
||||
|
||||
This is fixed for top-level lists, but it can still happen for |
||||
sub-lists. E.g., the following list item will not be parsed |
||||
properly: |
||||
|
||||
+ I recommend upgrading to version |
||||
8. Oops, now this line is treated |
||||
as a sub-list. |
||||
|
||||
Given Markdown's list-creation rules, I'm not sure this can |
||||
be fixed. |
||||
|
||||
+ Standalone HTML comments are now handled; previously, they'd get |
||||
wrapped in a spurious `<p>` tag. |
||||
|
||||
+ Fix for horizontal rules preceded by 2 or 3 spaces. |
||||
|
||||
+ `<hr>` HTML tags in must occur within three spaces of left |
||||
margin. (With 4 spaces or a tab, they should be code blocks, but |
||||
weren't before this fix.) |
||||
|
||||
+ Capitalized "With" in "Markdown With SmartyPants" for |
||||
consistency with the same string label in SmartyPants.pl. |
||||
(This fix is specific to the MT plug-in interface.) |
||||
|
||||
+ Auto-linked email address can now optionally contain |
||||
a 'mailto:' protocol. I.e. these are equivalent: |
||||
|
||||
<mailto:user@example.com> |
||||
<user@example.com> |
||||
|
||||
+ Fixed annoying bug where nested lists would wind up with |
||||
spurious (and invalid) `<p>` tags. |
||||
|
||||
+ You can now write empty links: |
||||
|
||||
[like this]() |
||||
|
||||
and they'll be turned into anchor tags with empty href attributes. |
||||
This should have worked before, but didn't. |
||||
|
||||
+ `***this***` and `___this___` are now turned into |
||||
|
||||
<strong><em>this</em></strong> |
||||
|
||||
Instead of |
||||
|
||||
<strong><em>this</strong></em> |
||||
|
||||
which isn't valid. (Thanks to Michel Fortin for the fix.) |
||||
|
||||
+ Added a new substitution in `_EncodeCode()`: s/\$/$/g; This |
||||
is only for the benefit of Blosxom users, because Blosxom |
||||
(sometimes?) interpolates Perl scalars in your article bodies. |
||||
|
||||
+ Fixed problem for links defined with urls that include parens, e.g.: |
||||
|
||||
[1]: http://sources.wikipedia.org/wiki/Middle_East_Policy_(Chomsky) |
||||
|
||||
"Chomsky" was being erroneously treated as the URL's title. |
||||
|
||||
+ At some point during 1.0's beta cycle, I changed every sub's |
||||
argument fetching from this idiom: |
||||
|
||||
my $text = shift; |
||||
|
||||
to: |
||||
|
||||
my $text = shift || return ''; |
||||
|
||||
The idea was to keep Markdown from doing any work in a sub |
||||
if the input was empty. This introduced a bug, though: |
||||
if the input to any function was the single-character string |
||||
"0", it would also evaluate as false and return immediately. |
||||
How silly. Now fixed. |
||||
|
||||
|
||||
|
||||
Donations |
||||
--------- |
||||
|
||||
Donations to support Markdown's development are happily accepted. See: |
||||
<http://daringfireball.net/projects/markdown/> for details. |
||||
|
||||
|
||||
|
||||
Copyright and License |
||||
--------------------- |
||||
|
||||
Copyright (c) 2003-2004 John Gruber |
||||
<http://daringfireball.net/> |
||||
All rights reserved. |
||||
|
||||
Redistribution and use in source and binary forms, with or without |
||||
modification, are permitted provided that the following conditions are |
||||
met: |
||||
|
||||
* Redistributions of source code must retain the above copyright notice, |
||||
this list of conditions and the following disclaimer. |
||||
|
||||
* Redistributions in binary form must reproduce the above copyright |
||||
notice, this list of conditions and the following disclaimer in the |
||||
documentation and/or other materials provided with the distribution. |
||||
|
||||
* Neither the name "Markdown" nor the names of its contributors may |
||||
be used to endorse or promote products derived from this software |
||||
without specific prior written permission. |
||||
|
||||
This software is provided by the copyright holders and contributors "as |
||||
is" and any express or implied warranties, including, but not limited |
||||
to, the implied warranties of merchantability and fitness for a |
||||
particular purpose are disclaimed. In no event shall the copyright owner |
||||
or contributors be liable for any direct, indirect, incidental, special, |
||||
exemplary, or consequential damages (including, but not limited to, |
||||
procurement of substitute goods or services; loss of use, data, or |
||||
profits; or business interruption) however caused and on any theory of |
||||
liability, whether in contract, strict liability, or tort (including |
||||
negligence or otherwise) arising in any way out of the use of this |
||||
software, even if advised of the possibility of such damage. |
||||
@ -1,781 +0,0 @@
@@ -1,781 +0,0 @@
|
||||
<h1>Markdown文件</h1> |
||||
|
||||
<p><img src="https://markdown.tw/images/208x128.png" alt="Markdown" title="" /></p> |
||||
|
||||
<p><strong>NOTE:</strong> This is Traditional Chinese Edition Document of |
||||
Markdown Syntax. If you are seeking for English Edition |
||||
Document. Please refer to <a href="http://daringfireball.net/projects/markdown/syntax">Markdown: Syntax</a>.</p> |
||||
|
||||
<h1>Markdown: Syntax</h1> |
||||
|
||||
<ul> |
||||
<li><a href="#overview">概述</a> |
||||
<ul> |
||||
<li><a href="#philosophy">哲學</a></li> |
||||
<li><a href="#html">行內 HTML</a></li> |
||||
<li><a href="#autoescape">特殊字元自動轉換</a></li> |
||||
</ul></li> |
||||
<li><a href="#block">區塊元素</a> |
||||
<ul> |
||||
<li><a href="#p">段落和換行</a></li> |
||||
<li><a href="#header">標題</a></li> |
||||
<li><a href="#blockquote">區塊引言</a></li> |
||||
<li><a href="#list">清單</a></li> |
||||
<li><a href="#precode">程式碼區塊</a></li> |
||||
<li><a href="#hr">分隔線</a></li> |
||||
</ul></li> |
||||
<li><a href="#span">區段元素</a> |
||||
<ul> |
||||
<li><a href="#link">連結</a></li> |
||||
<li><a href="#em">強調</a></li> |
||||
<li><a href="#code">程式碼</a></li> |
||||
<li><a href="#img">圖片</a></li> |
||||
</ul></li> |
||||
<li><a href="#misc">其他</a> |
||||
<ul> |
||||
<li><a href="#backslash">跳脫字元</a></li> |
||||
<li><a href="#autolink">自動連結</a></li> |
||||
</ul></li> |
||||
<li><a href="#acknowledgement">感謝</a></li> |
||||
</ul> |
||||
|
||||
<p><strong>注意：</strong>這份文件是用Markdown寫的，你可以<a href="https://github.com/othree/markdown-syntax-zhtw/blob/master/syntax.md">看看它的原始檔</a> 。</p> |
||||
|
||||
<hr /> |
||||
|
||||
<h2 id="overview">概述</h2> |
||||
|
||||
<h3 id="philosophy">哲學</h3> |
||||
|
||||
<p>Markdown的目標是實現「易讀易寫」。</p> |
||||
|
||||
<p>不過最需要強調的便是它的可讀性。一份使用Markdown格式撰寫的文件應該可以直接以純文字發佈，並且看起來不會像是由許多標籤或是格式指令所構成。Markdown語法受到一些既有text-to-HTML格式的影響，包括<a href="http://docutils.sourceforge.net/mirror/setext.html">Setext</a>、<a href="http://www.aaronsw.com/2002/atx/">atx</a>、<a href="http://textism.com/tools/textile/">Textile</a>、<a href="http://docutils.sourceforge.net/rst.html">reStructuredText</a>、<a href="http://www.triptico.com/software/grutatxt.html">Grutatext</a> 和 <a href="http://ettext.taint.org/doc/">EtText</a>，然而最大靈感來源其實是純文字的電子郵件格式。</p> |
||||
|
||||
<p>因此Markdown的語法全由標點符號所組成，並經過嚴謹慎選，是為了讓它們看起來就像所要表達的意思。像是在文字兩旁加上星號，看起來就像*強調*。Markdown的清單看起來，嗯，就是清單。假如你有使用過電子郵件，區塊引言看起來就真的像是引用一段文字。</p> |
||||
|
||||
<h3 id="html">行內HTML</h3> |
||||
|
||||
<p>Markdown的語法有個主要的目的：用來作為一種網路內容的<em>寫作</em>用語言。</p> |
||||
|
||||
<p>Markdown不是要來取代HTML，甚至也沒有要和它相似，它的語法種類不多，只和HTML的一部分有關係，重點<em>不是</em>要創造一種更容易寫作HTML文件的語法，我認為HTML已經很容易寫了，Markdow的重點在於，它能讓文件更容易閱讀、編寫。HTML 是一種<em>發佈</em>的格式，Markdown是一種<em>編寫</em>的格式，因此，Markdown的格式語法只涵蓋純文字可以涵蓋的範圍。</p> |
||||
|
||||
<p>不在Markdown涵蓋範圍之外的標籤，都可以直接在文件裡面用HTML撰寫。不需要額外標註這是HTML或是Markdown；只要直接加標籤就可以了。</p> |
||||
|
||||
<p>只有區塊元素──比如<code><div></code>、<code><table></code>、<code><pre></code>、<code><p></code>等標籤，必需在前後加上空行，以利與內容區隔。而且這些（元素）的開始與結尾標籤，不可以用tab或是空白來縮排。Markdown的產生器有智慧型判斷，可以避免在區塊標籤前後加上沒有必要的<code><p></code>標籤。</p> |
||||
|
||||
<p>舉例來說，在Markdown文件裡加上一段HTML表格：</p> |
||||
|
||||
<pre><code>This is a regular paragraph. |
||||
|
||||
<table> |
||||
<tr> |
||||
<td>Foo</td> |
||||
</tr> |
||||
</table> |
||||
|
||||
This is another regular paragraph. |
||||
</code></pre> |
||||
|
||||
<p>請注意，Markdown語法在HTML區塊標籤中將不會被進行處理。例如，你無法在HTML區塊內使用Markdown形式的<code>*強調*</code>。</p> |
||||
|
||||
<p>HTML的區段標籤如<code><span></code>、<code><cite></code>、<code><del></code>則不受限制，可以在Markdown的段落、清單或是標題裡任意使用。依照個人習慣，甚至可以不用Markdown格式，而採用HTML標籤來格式化。舉例說明：如果比較喜歡HTML的 <code><a></code>或<code><img></code>標籤，可以直接使用這些標籤，而不用Markdown提供的連結或是影像標示語法。</p> |
||||
|
||||
<p>HTML區段標籤和區塊標籤不同，在區段標籤的範圍內，Markdown的語法是有效的。</p> |
||||
|
||||
<h3 id="autoescape">特殊字元自動轉換</h3> |
||||
|
||||
<p>在HTML文件中，有兩個字元需要特殊處理：<code><</code>和<code>&</code>。<code><</code>符號用於起始標籤<code>&</code>符號則用於標記HTML實體，如果你只是想要使用這些符號，你必須要使用實體的形式，像是<code>&lt;</code>和<code>&amp;</code>。</p> |
||||
|
||||
<p><code>&</code> 符號其實很容易讓寫作網路文件的人感到困擾，如果你要打「AT&T」 ，你必須要寫成「<code>AT&amp;T</code>」 ，還得轉換網址內的 <code>&</code> 符號，如果你要連結到：</p> |
||||
|
||||
<pre><code>http://images.google.com/images?num=30&q=larry+bird |
||||
</code></pre> |
||||
|
||||
<p>你必須要把網址轉成：</p> |
||||
|
||||
<pre><code>http://images.google.com/images?num=30&amp;q=larry+bird |
||||
</code></pre> |
||||
|
||||
<p>才能放到連結標籤的<code>href</code>屬性裡。不用說也知道這很容易忘記，這也可能是HTML標準檢查所檢查到的錯誤中，數量最多的。</p> |
||||
|
||||
<p>Markdown允許你直接使用這些符號，但是你要小心跳脫字元的使用，如果你是在HTML實體中使用<code>&</code>符號的話，它不會被轉換，而在其他情形下，它則會被轉換成<code>&amp;</code>。所以你如果要在文件中插入一個著作權的符號，你可以這樣寫：</p> |
||||
|
||||
<pre><code>&copy; |
||||
</code></pre> |
||||
|
||||
<p>Markdown將不會對這段文字做修改，但是如果你這樣寫：</p> |
||||
|
||||
<pre><code>AT&T |
||||
</code></pre> |
||||
|
||||
<p>Markdown就會將它轉為：</p> |
||||
|
||||
<pre><code>AT&amp;T |
||||
</code></pre> |
||||
|
||||
<p>類似的狀況也會發生在<code><</code>符號上，因為Markdown支援<a href="#html">行內 HTML</a> ，如果你是使用<code><</code>符號作為HTML標籤使用，那Markdown也不會對它做任何轉換，但是如果你是寫：</p> |
||||
|
||||
<pre><code>4 < 5 |
||||
</code></pre> |
||||
|
||||
<p>Markdown將會把它轉換為：</p> |
||||
|
||||
<pre><code>4 &lt; 5 |
||||
</code></pre> |
||||
|
||||
<p>不過需要注意的是，code範圍內，不論是行內還是區塊，<code><</code>和<code>&</code>兩個符號都<em>一定</em>會被轉換成HTML實體，這項特性讓你可以很容易地用Markdown寫HTML code（和HTML相對而言。在HTML語法中，你要把所有的<code><</code>和<code>&</code>都轉換為 HTML實體，才能在HTML文件裡面寫出HTML code。）</p> |
||||
|
||||
<hr /> |
||||
|
||||
<h2 id="block">區塊元素</h2> |
||||
|
||||
<h3 id="p">段落和換行</h3> |
||||
|
||||
<p>一個段落是由一個以上相連接的行句組成，而一個以上的空行則會切分出不同的段落（空行的定義是顯示上看起來像是空行，便會被視為空行。比方說，若某一行只包含空白和tab，則該行也會被視為空行），一般的段落不需要用空白或斷行縮排。</p> |
||||
|
||||
<p>「一個以上相連接的行句組成」這句話其實暗示了Markdown允許段落內的強迫斷行，這個特性和其他大部分的text-to-HTML格式不一樣（包括 MovableType的「Convert Line Breaks」選項），其他的格式會把每個斷行都轉成<code><br /></code>標籤。</p> |
||||
|
||||
<p>如果你<em>真的</em>想要插入<code><br /></code>標籤的話，在行尾加上兩個以上的空白，然後按enter。</p> |
||||
|
||||
<p>是的，這確實需要花比較多功夫來插入<code><br /></code>，但是「每個換行都轉換為<code><br /></code>」的方法在Markdown中並不適合， Markdown中email式的<a href="#blockquote">區塊引言</a>和多段落的<a href="#list">清單</a>在使用換行來排版的時候，不但更好用，還更好閱讀。</p> |
||||
|
||||
<h3 id="header">標題</h3> |
||||
|
||||
<p>Markdown支援兩種標題的語法，<a href="http://docutils.sourceforge.net/mirror/setext.html">Setext</a>和<a href="http://www.aaronsw.com/2002/atx/">atx</a>形式。</p> |
||||
|
||||
<p>Setext形式是用底線的形式，利用<code>=</code>（最高階標題）和<code>-</code>（第二階標題），例如：</p> |
||||
|
||||
<pre><code>This is an H1 |
||||
============= |
||||
|
||||
This is an H2 |
||||
------------- |
||||
</code></pre> |
||||
|
||||
<p>任何數量的<code>=</code>和<code>-</code>都可以有效果。</p> |
||||
|
||||
<p>Atx形式則是在行首插入1到6個 <code>#</code> ，各對應到標題1到6階，例如：</p> |
||||
|
||||
<pre><code># This is an H1 |
||||
|
||||
## This is an H2 |
||||
|
||||
###### This is an H6 |
||||
</code></pre> |
||||
|
||||
<p>你可以選擇性地「關閉」atx樣式的標題，這純粹只是美觀用的，若是覺得這樣看起來比較舒適，你就可以在行尾加上<code>#</code>，而行尾的<code>#</code>數量也不用和開頭一樣（行首的井字數量決定標題的階數）：</p> |
||||
|
||||
<pre><code># This is an H1 # |
||||
|
||||
## This is an H2 ## |
||||
|
||||
### This is an H3 ###### |
||||
</code></pre> |
||||
|
||||
<h3 id="blockquote">區塊引言</h3> |
||||
|
||||
<p>Markdown使用email形式的區塊引言，如果你很熟悉如何在email信件中引言，你就知道怎麼在Markdown文件中建立一個區塊引言，那會看起來像是你強迫斷行，然後在每行的最前面加上<code>></code>：</p> |
||||
|
||||
<pre><code>> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, |
||||
> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. |
||||
> Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. |
||||
> |
||||
> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse |
||||
> id sem consectetuer libero luctus adipiscing. |
||||
</code></pre> |
||||
|
||||
<p>Markdown也允許你只在整個段落的第一行最前面加上<code>></code>：</p> |
||||
|
||||
<pre><code>> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, |
||||
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. |
||||
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. |
||||
|
||||
> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse |
||||
id sem consectetuer libero luctus adipiscing. |
||||
</code></pre> |
||||
|
||||
<p>區塊引言可以有階層（例如：引言內的引言），只要根據層數加上不同數量的<code>></code>：</p> |
||||
|
||||
<pre><code>> This is the first level of quoting. |
||||
> |
||||
> > This is nested blockquote. |
||||
> |
||||
> Back to the first level. |
||||
</code></pre> |
||||
|
||||
<p>引言的區塊內也可以使用其他的Markdown語法，包括標題、清單、程式碼區塊等：</p> |
||||
|
||||
<pre><code>> ## This is a header. |
||||
> |
||||
> 1. This is the first list item. |
||||
> 2. This is the second list item. |
||||
> |
||||
> Here's some example code: |
||||
> |
||||
> return shell_exec("echo $input | $markdown_script"); |
||||
</code></pre> |
||||
|
||||
<p>任何標準的文字編輯器都能簡單地建立email樣式的引言，例如BBEdit，你可以選取文字後然後從選單中選擇<em>增加引言階層</em>。</p> |
||||
|
||||
<h3 id="list">清單</h3> |
||||
|
||||
<p>Markdown支援有序清單和無序清單。</p> |
||||
|
||||
<p>無序清單使用星號、加號或是減號作為清單標記：</p> |
||||
|
||||
<pre><code>* Red |
||||
* Green |
||||
* Blue |
||||
</code></pre> |
||||
|
||||
<p>等同於：</p> |
||||
|
||||
<pre><code>+ Red |
||||
+ Green |
||||
+ Blue |
||||
</code></pre> |
||||
|
||||
<p>也等同於：</p> |
||||
|
||||
<pre><code>- Red |
||||
- Green |
||||
- Blue |
||||
</code></pre> |
||||
|
||||
<p>有序清單則使用數字接著一個英文句點：</p> |
||||
|
||||
<pre><code>1. Bird |
||||
2. McHale |
||||
3. Parish |
||||
</code></pre> |
||||
|
||||
<p>很重要的一點是，你在清單標記上使用的數字並不會影響輸出的HTML結果，上面的清單所產生的HTML標記為：</p> |
||||
|
||||
<pre><code><ol> |
||||
<li>Bird</li> |
||||
<li>McHale</li> |
||||
<li>Parish</li> |
||||
</ol> |
||||
</code></pre> |
||||
|
||||
<p>如果你的清單標記寫成：</p> |
||||
|
||||
<pre><code>1. Bird |
||||
1. McHale |
||||
1. Parish |
||||
</code></pre> |
||||
|
||||
<p>或甚至是：</p> |
||||
|
||||
<pre><code>3. Bird |
||||
1. McHale |
||||
8. Parish |
||||
</code></pre> |
||||
|
||||
<p>你都會得到完全相同的HTML輸出。重點在於，你可以讓Markdown文件的清單數字和輸出的結果相同，或是你懶一點，你可以完全不用在意數字的正確性。</p> |
||||
|
||||
<p>如果你使用懶惰的寫法，建議第一個項目最好還是從「1.」開始，因為Markdown未來可能會支援有序清單的start屬性。</p> |
||||
|
||||
<p>清單項目標記通常是放在最左邊，但是其實也可以縮排，最多三個空白，項目標記後面則一定要接著至少一個空白或tab。</p> |
||||
|
||||
<p>要讓清單看起來更漂亮，你可以把內容用固定的縮排整理好：</p> |
||||
|
||||
<pre><code>* Lorem ipsum dolor sit amet, consectetuer adipiscing elit. |
||||
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, |
||||
viverra nec, fringilla in, laoreet vitae, risus. |
||||
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit. |
||||
Suspendisse id sem consectetuer libero luctus adipiscing. |
||||
</code></pre> |
||||
|
||||
<p>但是如果你很懶，那也不一定需要：</p> |
||||
|
||||
<pre><code>* Lorem ipsum dolor sit amet, consectetuer adipiscing elit. |
||||
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, |
||||
viverra nec, fringilla in, laoreet vitae, risus. |
||||
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit. |
||||
Suspendisse id sem consectetuer libero luctus adipiscing. |
||||
</code></pre> |
||||
|
||||
<p>如果清單項目間用空行分開， Markdown會把項目的內容在輸出時用<code><p></code>標籤包起來，舉例來說：</p> |
||||
|
||||
<pre><code>* Bird |
||||
* Magic |
||||
</code></pre> |
||||
|
||||
<p>會被轉換為：</p> |
||||
|
||||
<pre><code><ul> |
||||
<li>Bird</li> |
||||
<li>Magic</li> |
||||
</ul> |
||||
</code></pre> |
||||
|
||||
<p>但是這個：</p> |
||||
|
||||
<pre><code>* Bird |
||||
|
||||
* Magic |
||||
</code></pre> |
||||
|
||||
<p>會被轉換為：</p> |
||||
|
||||
<pre><code><ul> |
||||
<li><p>Bird</p></li> |
||||
<li><p>Magic</p></li> |
||||
</ul> |
||||
</code></pre> |
||||
|
||||
<p>清單項目可以包含多個段落，每個項目下的段落都必須縮排4個空白或是一個tab：</p> |
||||
|
||||
<pre><code>1. This is a list item with two paragraphs. Lorem ipsum dolor |
||||
sit amet, consectetuer adipiscing elit. Aliquam hendrerit |
||||
mi posuere lectus. |
||||
|
||||
Vestibulum enim wisi, viverra nec, fringilla in, laoreet |
||||
vitae, risus. Donec sit amet nisl. Aliquam semper ipsum |
||||
sit amet velit. |
||||
|
||||
2. Suspendisse id sem consectetuer libero luctus adipiscing. |
||||
</code></pre> |
||||
|
||||
<p>如果你每行都有縮排，看起來會看好很多，當然，再次地，如果你很懶惰，Markdown也允許：</p> |
||||
|
||||
<pre><code>* This is a list item with two paragraphs. |
||||
|
||||
This is the second paragraph in the list item. You're |
||||
only required to indent the first line. Lorem ipsum dolor |
||||
sit amet, consectetuer adipiscing elit. |
||||
|
||||
* Another item in the same list. |
||||
</code></pre> |
||||
|
||||
<p>如果要在清單項目內放進引言，那<code>></code>就需要縮排：</p> |
||||
|
||||
<pre><code>* A list item with a blockquote: |
||||
|
||||
> This is a blockquote |
||||
> inside a list item. |
||||
</code></pre> |
||||
|
||||
<p>如果要放程式碼區塊的話，該區塊就需要縮排<em>兩次</em>，也就是8個空白或是兩個tab：</p> |
||||
|
||||
<pre><code>* A list item with a code block: |
||||
|
||||
<code goes here> |
||||
</code></pre> |
||||
|
||||
<p>當然，項目清單很可能會不小心產生，像是下面這樣的寫法：</p> |
||||
|
||||
<pre><code>1986. What a great season. |
||||
</code></pre> |
||||
|
||||
<p>換句話說，也就是在行首出現<em>數字－句點－空白</em>，要避免這樣的狀況，你可以在句點前面加上反斜線。</p> |
||||
|
||||
<pre><code>1986\. What a great season. |
||||
</code></pre> |
||||
|
||||
<h3 id="precode">程式碼區塊</h3> |
||||
|
||||
<p>和程式相關的寫作或是標籤語言原始碼通常會有已經排版好的程式碼區塊，通常這些區塊我們並不希望它以一般段落文件的方式去排版，而是照原來的樣子顯示，Markdown會用<code><pre></code>和<code><code></code>標籤來把程式碼區塊包起來。</p> |
||||
|
||||
<p>要在Markdown中建立程式碼區塊很簡單，只要簡單地縮排4個空白或是1個tab就可以，例如，下面的輸入：</p> |
||||
|
||||
<pre><code>This is a normal paragraph: |
||||
|
||||
This is a code block. |
||||
</code></pre> |
||||
|
||||
<p>Markdown會轉換成：</p> |
||||
|
||||
<pre><code><p>This is a normal paragraph:</p> |
||||
|
||||
<pre><code>This is a code block. |
||||
</code></pre> |
||||
</code></pre> |
||||
|
||||
<p>這個每行一階的縮排（4個空白或是1個tab），都會被移除，例如：</p> |
||||
|
||||
<pre><code>Here is an example of AppleScript: |
||||
|
||||
tell application "Foo" |
||||
beep |
||||
end tell |
||||
</code></pre> |
||||
|
||||
<p>會被轉換為：</p> |
||||
|
||||
<pre><code><p>Here is an example of AppleScript:</p> |
||||
|
||||
<pre><code>tell application "Foo" |
||||
beep |
||||
end tell |
||||
</code></pre> |
||||
</code></pre> |
||||
|
||||
<p>一個程式碼區塊會一直持續到沒有縮排的那一行（或是文件結尾）。</p> |
||||
|
||||
<p>在程式碼區塊裡面，<code>&</code>、<code><</code>和<code>></code>會自動轉成HTML實體，這樣的方式讓你非常容易使用Markdown插入範例用的HTML原始碼，只需要複製貼上，再加上縮排就可以了，剩下的Markdown都會幫你處理，例如：</p> |
||||
|
||||
<pre><code> <div class="footer"> |
||||
&copy; 2004 Foo Corporation |
||||
</div> |
||||
</code></pre> |
||||
|
||||
<p>會被轉換為：</p> |
||||
|
||||
<pre><code><pre><code>&lt;div class="footer"&gt; |
||||
&amp;copy; 2004 Foo Corporation |
||||
&lt;/div&gt; |
||||
</code></pre> |
||||
</code></pre> |
||||
|
||||
<p>程式碼區塊中，一般的Markdown語法不會被轉換，像是星號便只是星號，這表示你可以很容易地以Markdown語法撰寫Markdown語法相關的文件。</p> |
||||
|
||||
<h3 id="hr">分隔線</h3> |
||||
|
||||
<p>你可以在一行中用三個或以上的星號、減號、底線來建立一個分隔線，行內不能有其他東西。你也可以在星號中間插入空白。下面每種寫法都可以建立分隔線：</p> |
||||
|
||||
<pre><code>* * * |
||||
|
||||
*** |
||||
|
||||
***** |
||||
|
||||
- - - |
||||
|
||||
--------------------------------------- |
||||
</code></pre> |
||||
|
||||
<hr /> |
||||
|
||||
<h2 id="span">區段元素</h2> |
||||
|
||||
<h3 id="link">連結</h3> |
||||
|
||||
<p>Markdown支援兩種形式的連結語法：<em>行內</em>和<em>參考</em>兩種形式。</p> |
||||
|
||||
<p>不管是哪一種，連結的文字都是用 [方括號] 來標記。</p> |
||||
|
||||
<p>要建立一個行內形式的連結，只要在方塊括號後面馬上接著括號並插入網址連結即可，如果你還想要加上連結的title文字，只要在網址後面，用雙引號把title文字包起來即可，例如：</p> |
||||
|
||||
<pre><code>This is [an example](http://example.com/ "Title") inline link. |
||||
|
||||
[This link](http://example.net/) has no title attribute. |
||||
</code></pre> |
||||
|
||||
<p>會產生：</p> |
||||
|
||||
<pre><code><p>This is <a href="http://example.com/" title="Title"> |
||||
an example</a> inline link.</p> |
||||
|
||||
<p><a href="http://example.net/">This link</a> has no |
||||
title attribute.</p> |
||||
</code></pre> |
||||
|
||||
<p>如果你是要連結到同樣主機的資源，你可以使用相對路徑：</p> |
||||
|
||||
<pre><code>See my [About](/about/) page for details. |
||||
</code></pre> |
||||
|
||||
<p>參考形式的連結使用另外一個方括號接在連結文字的括號後面，而在第二個方括號裡面要填入用以辨識連結的標籤：</p> |
||||
|
||||
<pre><code>This is [an example][id] reference-style link. |
||||
</code></pre> |
||||
|
||||
<p>你也可以選擇性地在兩個方括號中間加上空白：</p> |
||||
|
||||
<pre><code>This is [an example] [id] reference-style link. |
||||
</code></pre> |
||||
|
||||
<p>接著，在文件的任意處，你可以把這個標籤的連結內容定義出來：</p> |
||||
|
||||
<pre><code>[id]: http://example.com/ "Optional Title Here" |
||||
</code></pre> |
||||
|
||||
<p>連結定義的形式為：</p> |
||||
|
||||
<ul> |
||||
<li>方括號，裡面輸入連結的辨識用標籤</li> |
||||
<li>接著一個冒號</li> |
||||
<li>接著一個以上的空白或tab</li> |
||||
<li>接著連結的網址</li> |
||||
<li>選擇性地接著title內容，可以用單引號、雙引號或是括弧包著</li> |
||||
</ul> |
||||
|
||||
<p>下面這三種連結的定義都是相同：</p> |
||||
|
||||
<pre><code>[foo]: http://example.com/ "Optional Title Here" |
||||
[foo]: http://example.com/ 'Optional Title Here' |
||||
[foo]: http://example.com/ (Optional Title Here) |
||||
</code></pre> |
||||
|
||||
<p><strong>請注意：</strong>有一個已知的問題是Markdown.pl 1.0.1會忽略單引號包起來的連結title。</p> |
||||
|
||||
<p>連結網址也可以用角括號包起來：</p> |
||||
|
||||
<pre><code>[id]: <http://example.com/> "Optional Title Here" |
||||
</code></pre> |
||||
|
||||
<p>你也可以把title屬性放到下一行，也可以加一些縮排，網址太長的話，這樣會比較好看：</p> |
||||
|
||||
<pre><code>[id]: http://example.com/longish/path/to/resource/here |
||||
"Optional Title Here" |
||||
</code></pre> |
||||
|
||||
<p>網址定義只有在產生連結的時候用到，並不會直接出現在文件之中。</p> |
||||
|
||||
<p>連結辨識標籤可以有字母、數字、空白和標點符號，但是並<em>不</em>區分大小寫，因此下面兩個連結是一樣的：</p> |
||||
|
||||
<pre><code>[link text][a] |
||||
[link text][A] |
||||
</code></pre> |
||||
|
||||
<p><em>預設的連結標籤</em>功能讓你可以省略指定連結標籤，這種情形下，連結標籤和連結文字會視為相同，要用預設連結標籤只要在連結文字後面加上一個空的方括號，如果你要讓"Google"連結到google.com，你可以簡化成：</p> |
||||
|
||||
<pre><code>[Google][] |
||||
</code></pre> |
||||
|
||||
<p>然後定義連結內容：</p> |
||||
|
||||
<pre><code>[Google]: http://google.com/ |
||||
</code></pre> |
||||
|
||||
<p>由於連結文字可能包含空白，所以這種簡化的標籤內也可以包含多個文字：</p> |
||||
|
||||
<pre><code>Visit [Daring Fireball][] for more information. |
||||
</code></pre> |
||||
|
||||
<p>然後接著定義連結：</p> |
||||
|
||||
<pre><code>[Daring Fireball]: http://daringfireball.net/ |
||||
</code></pre> |
||||
|
||||
<p>連結的定義可以放在文件中的任何一個地方，我比較偏好直接放在連結出現段落的後面，你也可以把它放在文件最後面，就像是註解一樣。</p> |
||||
|
||||
<p>下面是一個參考式連結的範例：</p> |
||||
|
||||
<pre><code>I get 10 times more traffic from [Google] [1] than from |
||||
[Yahoo] [2] or [MSN] [3]. |
||||
|
||||
[1]: http://google.com/ "Google" |
||||
[2]: http://search.yahoo.com/ "Yahoo Search" |
||||
[3]: http://search.msn.com/ "MSN Search" |
||||
</code></pre> |
||||
|
||||
<p>如果改成用連結名稱的方式寫：</p> |
||||
|
||||
<pre><code>I get 10 times more traffic from [Google][] than from |
||||
[Yahoo][] or [MSN][]. |
||||
|
||||
[google]: http://google.com/ "Google" |
||||
[yahoo]: http://search.yahoo.com/ "Yahoo Search" |
||||
[msn]: http://search.msn.com/ "MSN Search" |
||||
</code></pre> |
||||
|
||||
<p>上面兩種寫法都會產生下面的HTML。</p> |
||||
|
||||
<pre><code><p>I get 10 times more traffic from <a href="http://google.com/" |
||||
title="Google">Google</a> than from |
||||
<a href="http://search.yahoo.com/" title="Yahoo Search">Yahoo</a> |
||||
or <a href="http://search.msn.com/" title="MSN Search">MSN</a>.</p> |
||||
</code></pre> |
||||
|
||||
<p>下面是用行內形式寫的同樣一段內容的Markdown文件，提供作為比較之用：</p> |
||||
|
||||
<pre><code>I get 10 times more traffic from [Google](http://google.com/ "Google") |
||||
than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or |
||||
[MSN](http://search.msn.com/ "MSN Search"). |
||||
</code></pre> |
||||
|
||||
<p>參考式的連結其實重點不在於它比較好寫，而是它比較好讀，比較一下上面的範例，使用參考式的文章本身只有81個字元，但是用行內形式的連結卻會增加到176個字元，如果是用純HTML格式來寫，會有234個字元，在HTML格式中，標籤比文字還要多。</p> |
||||
|
||||
<p>使用Markdown的參考式連結，可以讓文件更像是瀏覽器最後產生的結果，讓你可以把一些標記相關的資訊移到段落文字之外，你就可以增加連結而不讓文章的閱讀感覺被打斷。</p> |
||||
|
||||
<h3 id="em">強調</h3> |
||||
|
||||
<p>Markdown使用星號（<code>*</code>）和底線（<code>_</code>）作為標記強調字詞的符號，被<code>*</code>或<code>_</code>包圍的字詞會被轉成用<code><em></code>標籤包圍，用兩個<code>*</code>或<code>_</code>包起來的話，則會被轉成<code><strong></code>，例如：</p> |
||||
|
||||
<pre><code>*single asterisks* |
||||
|
||||
_single underscores_ |
||||
|
||||
**double asterisks** |
||||
|
||||
__double underscores__ |
||||
</code></pre> |
||||
|
||||
<p>會轉成：</p> |
||||
|
||||
<pre><code><em>single asterisks</em> |
||||
|
||||
<em>single underscores</em> |
||||
|
||||
<strong>double asterisks</strong> |
||||
|
||||
<strong>double underscores</strong> |
||||
</code></pre> |
||||
|
||||
<p>你可以隨便用你喜歡的樣式，唯一的限制是，你用什麼符號開啟標籤，就要用什麼符號結束。</p> |
||||
|
||||
<p>強調也可以直接插在文字中間：</p> |
||||
|
||||
<pre><code>un*frigging*believable |
||||
</code></pre> |
||||
|
||||
<p>但是如果你的 <code>*</code> 和 <code>_</code> 兩邊都有空白的話，它們就只會被當成普通的符號。</p> |
||||
|
||||
<p>如果要在文字前後直接插入普通的星號或底線，你可以用反斜線：</p> |
||||
|
||||
<pre><code>\*this text is surrounded by literal asterisks\* |
||||
</code></pre> |
||||
|
||||
<h3 id="code">程式碼</h3> |
||||
|
||||
<p>如果要標記一小段行內程式碼，你可以用反引號把它包起來（<code>`</code>），例如：</p> |
||||
|
||||
<pre><code>Use the `printf()` function. |
||||
</code></pre> |
||||
|
||||
<p>會產生：</p> |
||||
|
||||
<pre><code><p>Use the <code>printf()</code> function.</p> |
||||
</code></pre> |
||||
|
||||
<p>如果要在程式碼區段內插入反引號，你可以用多個反引號來開啟和結束程式碼區段：</p> |
||||
|
||||
<pre><code>``There is a literal backtick (`) here.`` |
||||
</code></pre> |
||||
|
||||
<p>這段語法會產生：</p> |
||||
|
||||
<pre><code><p><code>There is a literal backtick (`) here.</code></p> |
||||
</code></pre> |
||||
|
||||
<p>程式碼區段的起始和結束端都可以放入一個空白，起始端後面一個，結束端前面一個，這樣你就可以在區段的一開始就插入反引號：</p> |
||||
|
||||
<pre><code>A single backtick in a code span: `` ` `` |
||||
|
||||
A backtick-delimited string in a code span: `` `foo` `` |
||||
</code></pre> |
||||
|
||||
<p>會產生：</p> |
||||
|
||||
<pre><code><p>A single backtick in a code span: <code>`</code></p> |
||||
|
||||
<p>A backtick-delimited string in a code span: <code>`foo`</code></p> |
||||
</code></pre> |
||||
|
||||
<p>在程式碼區段內，<code>&</code>和角括號都會被轉成HTML實體，這樣會比較容易插入HTML原始碼，Markdown會把下面這段：</p> |
||||
|
||||
<pre><code>Please don't use any `<blink>` tags. |
||||
</code></pre> |
||||
|
||||
<p>轉為：</p> |
||||
|
||||
<pre><code><p>Please don't use any <code>&lt;blink&gt;</code> tags.</p> |
||||
</code></pre> |
||||
|
||||
<p>你也可以這樣寫：</p> |
||||
|
||||
<pre><code>`&#8212;` is the decimal-encoded equivalent of `&mdash;`. |
||||
</code></pre> |
||||
|
||||
<p>以產生：</p> |
||||
|
||||
<pre><code><p><code>&amp;#8212;</code> is the decimal-encoded |
||||
equivalent of <code>&amp;mdash;</code>.</p> |
||||
</code></pre> |
||||
|
||||
<h3 id="img">圖片</h3> |
||||
|
||||
<p>很明顯地，要在純文字應用中設計一個「自然」的語法來插入圖片是有一定難度的。</p> |
||||
|
||||
<p>Markdown使用一種和連結很相似的語法來標記圖片，同樣也允許兩種樣式：<em>行內</em>和<em>參考</em>。</p> |
||||
|
||||
<p>行內圖片的語法看起來像是：</p> |
||||
|
||||
<pre><code> |
||||
|
||||
 |
||||
</code></pre> |
||||
|
||||
<p>詳細敘述如下：</p> |
||||
|
||||
<ul> |
||||
<li>一個驚嘆號<code>!</code></li> |
||||
<li>接著一個方括號，裡面放上圖片的替代文字</li> |
||||
<li>接著一個普通括號，裡面放上圖片的網址，最後還可以用引號包住並加上 |
||||
選擇性的'title'文字。</li> |
||||
</ul> |
||||
|
||||
<p>參考式的圖片語法則長得像這樣：</p> |
||||
|
||||
<pre><code>![Alt text][id] |
||||
</code></pre> |
||||
|
||||
<p>「id」是圖片參考的名稱，圖片參考的定義方式則和連結參考一樣：</p> |
||||
|
||||
<pre><code>[id]: url/to/image "Optional title attribute" |
||||
</code></pre> |
||||
|
||||
<p>到目前為止， Markdown還沒有辦法指定圖片的寬高，如果你需要的話，你可以使用普通的<code><img></code>標籤。</p> |
||||
|
||||
<hr /> |
||||
|
||||
<h2 id="misc">其他</h2> |
||||
|
||||
<h3 id="autolink">自動連結</h3> |
||||
|
||||
<p>Markdown支援比較簡短的自動連結形式來處理網址和電子郵件信箱，只要是用角括號包起來，Markdown就會自動把它轉成連結，連結的文字就和連結位置一樣，例如：</p> |
||||
|
||||
<pre><code><http://example.com/> |
||||
</code></pre> |
||||
|
||||
<p>Markdown會轉為：</p> |
||||
|
||||
<pre><code><a href="http://example.com/">http://example.com/</a> |
||||
</code></pre> |
||||
|
||||
<p>自動的郵件連結也很類似，只是Markdown會先做一個編碼轉換的過程，把文字字元轉成16進位碼的HTML實體，這樣的格式可以混淆一些不好的信箱地址收集機器人，例如：</p> |
||||
|
||||
<pre><code><address@example.com> |
||||
</code></pre> |
||||
|
||||
<p>Markdown會轉成：</p> |
||||
|
||||
<pre><code><a href="&#x6D;&#x61;i&#x6C;&#x74;&#x6F;:&#x61;&#x64;&#x64;&#x72;&#x65; |
||||
&#115;&#115;&#64;&#101;&#120;&#x61;&#109;&#x70;&#x6C;e&#x2E;&#99;&#111; |
||||
&#109;">&#x61;&#x64;&#x64;&#x72;&#x65;&#115;&#115;&#64;&#101;&#120;&#x61; |
||||
&#109;&#x70;&#x6C;e&#x2E;&#99;&#111;&#109;</a> |
||||
</code></pre> |
||||
|
||||
<p>在瀏覽器裡面，這段字串會變成一個可以點擊的「address@example.com」連結。</p> |
||||
|
||||
<p>（這種作法雖然可以混淆不少的機器人，但並無法全部擋下來，不過這樣也比什麼都不做好些。無論如何，公開你的信箱終究會引來廣告信件的。）</p> |
||||
|
||||
<h3 id="backslash">跳脫字元</h3> |
||||
|
||||
<p>Markdown可以利用反斜線來插入一些在語法中有其他意義的符號，例如：如果你想要用星號加在文字旁邊的方式來做出強調效果（但不用<code><em></code>標籤），你可以在星號的前面加上反斜線：</p> |
||||
|
||||
<pre><code>\*literal asterisks\* |
||||
</code></pre> |
||||
|
||||
<p>Markdown支援在下面這些符號前面加上反斜線來幫助插入普通的符號：</p> |
||||
|
||||
<pre><code>\ 反斜線 |
||||
` 反引號 |
||||
* 星號 |
||||
_ 底線 |
||||
{} 大括號 |
||||
[] 方括號 |
||||
() 括號 |
||||
# 井字號 |
||||
+ 加號 |
||||
- 減號 |
||||
. 英文句點 |
||||
! 驚嘆號 |
||||
</code></pre> |
||||
|
||||
<h2 id="acknowledgement">感謝</h2> |
||||
|
||||
<p>感謝<a href="https://twitter.com/#!/leafy7382">leafy7382</a>協助翻譯，<a href="http://iamhlb.com/">hlb</a>、<a href="http://twitter.com/randylien">Randylien</a>幫忙潤稿，<a href="https://twitter.com/#!/ethantw">ethantw</a>的<a href="http://css.hanzi.co/">漢字標準格式</a>，<a href="http://kidwm.net/">WM</a>回報文字錯誤。</p> |
||||
@ -1 +0,0 @@
@@ -1 +0,0 @@
|
||||
google-site-verification: google76efb8f96e0c7ef9.html |
||||
|
Before Width: | Height: | Size: 2.6 KiB |
@ -1,580 +0,0 @@
@@ -1,580 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="zh-TW" class="han-biaodian-pro-cns han-la"> |
||||
<head> |
||||
<meta charset="UTF-8" /> |
||||
<title>Markdown 語法說明</title> |
||||
<link |
||||
rel="stylesheet" |
||||
media="all" |
||||
href="//cdnjs.cloudflare.com/ajax/libs/Han/3.2.2/han.min.css" |
||||
/> |
||||
<link rel="stylesheet" media="all" href="stylesheets/main.css" /> |
||||
<meta property="og:title" content="Markdown 語法說明" /> |
||||
<meta property="og:url" content="https://markdown.tw/" /> |
||||
<meta property="og:type" content="website" /> |
||||
<meta |
||||
property="og:description" |
||||
content="Markdown 是很簡單的純文件格式，由於語法設計得好，近幾年廣泛應用在各種領域，包括 Github、Stack Overflow 等知名的網路服務都使用它，本網頁為該語法的中文說明" |
||||
/> |
||||
<meta |
||||
property="og:image" |
||||
content="https://markdown.tw/images/208x128.png" |
||||
/> |
||||
<meta property="og:image:width" content="208" /> |
||||
<meta property="og:image:height" content="128" /> |
||||
</head> |
||||
<body |
||||
class="tk-source-han-sans-traditional" |
||||
style="font-family: -apple-system;" |
||||
> |
||||
<nav> |
||||
<a href="/">文件</a> |
||||
<a href="/resources.html">資源</a> |
||||
<a href="http://commonmark.org/" |
||||
>標準<img |
||||
src="external-link-alt-solid.svg" |
||||
width="12" |
||||
height="12" |
||||
alt="" |
||||
style="margin: 1px 0 -1px 3px;" |
||||
/></a> |
||||
<a href="https://github.com/othree/markdown-syntax-zhtw/issues" |
||||
>回報錯誤<img |
||||
src="external-link-alt-solid.svg" |
||||
width="12" |
||||
height="12" |
||||
alt="" |
||||
style="margin: 1px 0 -1px 3px;" |
||||
/></a> |
||||
</nav> |
||||
|
||||
<div class="wikistyle"> |
||||
<h1 id="markdown文件">Markdown文件</h1> |
||||
<p><img src="https://markdown.tw/images/208x128.png" /></p> |
||||
<p><strong>NOTE:</strong> This is Traditional Chinese Edition Document of Markdown Syntax. If you are seeking for English Edition Document. Please refer to <a href="http://daringfireball.net/projects/markdown/syntax">Markdown: Syntax</a>.</p> |
||||
<h1 id="markdown-syntax">Markdown: Syntax</h1> |
||||
<ul> |
||||
<li><a href="#overview">概述</a> |
||||
<ul> |
||||
<li><a href="#philosophy">哲學</a></li> |
||||
<li><a href="#html">行內 HTML</a></li> |
||||
<li><a href="#autoescape">特殊字元自動轉換</a></li> |
||||
</ul></li> |
||||
<li><a href="#block">區塊元素</a> |
||||
<ul> |
||||
<li><a href="#p">段落和換行</a></li> |
||||
<li><a href="#header">標題</a></li> |
||||
<li><a href="#blockquote">區塊引言</a></li> |
||||
<li><a href="#list">清單</a></li> |
||||
<li><a href="#precode">程式碼區塊</a></li> |
||||
<li><a href="#hr">分隔線</a></li> |
||||
</ul></li> |
||||
<li><a href="#span">區段元素</a> |
||||
<ul> |
||||
<li><a href="#link">連結</a></li> |
||||
<li><a href="#em">強調</a></li> |
||||
<li><a href="#code">程式碼</a></li> |
||||
<li><a href="#img">圖片</a></li> |
||||
</ul></li> |
||||
<li><a href="#misc">其他</a> |
||||
<ul> |
||||
<li><a href="#backslash">跳脫字元</a></li> |
||||
<li><a href="#autolink">自動連結</a></li> |
||||
</ul></li> |
||||
<li><a href="#acknowledgement">感謝</a></li> |
||||
</ul> |
||||
<p><strong>注意：</strong>這份文件是用Markdown寫的，你可以<a href="https://github.com/othree/markdown-syntax-zhtw/blob/master/syntax.md">看看它的原始檔</a> 。</p> |
||||
<hr /> |
||||
<h2 id="overview"> |
||||
概述 |
||||
</h2> |
||||
<h3 id="philosophy"> |
||||
哲學 |
||||
</h3> |
||||
<p>Markdown的目標是實現「易讀易寫」。</p> |
||||
<p>不過最需要強調的便是它的可讀性。一份使用Markdown格式撰寫的文件應該可以直接以純文字發佈，並且看起來不會像是由許多標籤或是格式指令所構成。Markdown語法受到一些既有text-to-HTML格式的影響，包括<a href="http://docutils.sourceforge.net/mirror/setext.html">Setext</a>、<a href="http://www.aaronsw.com/2002/atx/">atx</a>、<a href="http://textism.com/tools/textile/">Textile</a>、<a href="http://docutils.sourceforge.net/rst.html">reStructuredText</a>、<a href="http://www.triptico.com/software/grutatxt.html">Grutatext</a> 和 <a href="http://ettext.taint.org/doc/">EtText</a>，然而最大靈感來源其實是純文字的電子郵件格式。</p> |
||||
<p>因此Markdown的語法全由標點符號所組成，並經過嚴謹慎選，是為了讓它們看起來就像所要表達的意思。像是在文字兩旁加上星號，看起來就像*強調*。Markdown的清單看起來，嗯，就是清單。假如你有使用過電子郵件，區塊引言看起來就真的像是引用一段文字。</p> |
||||
<h3 id="html"> |
||||
行內HTML |
||||
</h3> |
||||
<p>Markdown的語法有個主要的目的：用來作為一種網路內容的<em>寫作</em>用語言。</p> |
||||
<p>Markdown不是要來取代HTML，甚至也沒有要和它相似，它的語法種類不多，只和HTML的一部分有關係，重點<em>不是</em>要創造一種更容易寫作HTML文件的語法，我認為HTML已經很容易寫了，Markdow的重點在於，它能讓文件更容易閱讀、編寫。HTML 是一種<em>發佈</em>的格式，Markdown是一種<em>編寫</em>的格式，因此，Markdown的格式語法只涵蓋純文字可以涵蓋的範圍。</p> |
||||
<p>不在Markdown涵蓋範圍之外的標籤，都可以直接在文件裡面用HTML撰寫。不需要額外標註這是HTML或是Markdown；只要直接加標籤就可以了。</p> |
||||
<p>只有區塊元素──比如<code><div></code>、<code><table></code>、<code><pre></code>、<code><p></code>等標籤，必需在前後加上空行，以利與內容區隔。而且這些（元素）的開始與結尾標籤，不可以用tab或是空白來縮排。Markdown的產生器有智慧型判斷，可以避免在區塊標籤前後加上沒有必要的<code><p></code>標籤。</p> |
||||
<p>舉例來說，在Markdown文件裡加上一段HTML表格：</p> |
||||
<pre><code>This is a regular paragraph. |
||||
|
||||
<table> |
||||
<tr> |
||||
<td>Foo</td> |
||||
</tr> |
||||
</table> |
||||
|
||||
This is another regular paragraph.</code></pre> |
||||
<p>請注意，Markdown語法在HTML區塊標籤中將不會被進行處理。例如，你無法在HTML區塊內使用Markdown形式的<code>*強調*</code>。</p> |
||||
<p>HTML的區段標籤如<code><span></code>、<code><cite></code>、<code><del></code>則不受限制，可以在Markdown的段落、清單或是標題裡任意使用。依照個人習慣，甚至可以不用Markdown格式，而採用HTML標籤來格式化。舉例說明：如果比較喜歡HTML的 <code><a></code>或<code><img></code>標籤，可以直接使用這些標籤，而不用Markdown提供的連結或是影像標示語法。</p> |
||||
<p>HTML區段標籤和區塊標籤不同，在區段標籤的範圍內，Markdown的語法是有效的。</p> |
||||
<h3 id="autoescape"> |
||||
特殊字元自動轉換 |
||||
</h3> |
||||
<p>在HTML文件中，有兩個字元需要特殊處理：<code><</code>和<code>&</code>。<code><</code>符號用於起始標籤<code>&</code>符號則用於標記HTML實體，如果你只是想要使用這些符號，你必須要使用實體的形式，像是<code>&lt;</code>和<code>&amp;</code>。</p> |
||||
<p><code>&</code> 符號其實很容易讓寫作網路文件的人感到困擾，如果你要打「AT&T」 ，你必須要寫成「<code>AT&amp;T</code>」 ，還得轉換網址內的 <code>&</code> 符號，如果你要連結到：</p> |
||||
<pre><code>http://images.google.com/images?num=30&q=larry+bird</code></pre> |
||||
<p>你必須要把網址轉成：</p> |
||||
<pre><code>http://images.google.com/images?num=30&amp;q=larry+bird</code></pre> |
||||
<p>才能放到連結標籤的<code>href</code>屬性裡。不用說也知道這很容易忘記，這也可能是HTML標準檢查所檢查到的錯誤中，數量最多的。</p> |
||||
<p>Markdown允許你直接使用這些符號，但是你要小心跳脫字元的使用，如果你是在HTML實體中使用<code>&</code>符號的話，它不會被轉換，而在其他情形下，它則會被轉換成<code>&amp;</code>。所以你如果要在文件中插入一個著作權的符號，你可以這樣寫：</p> |
||||
<pre><code>&copy;</code></pre> |
||||
<p>Markdown將不會對這段文字做修改，但是如果你這樣寫：</p> |
||||
<pre><code>AT&T</code></pre> |
||||
<p>Markdown就會將它轉為：</p> |
||||
<pre><code>AT&amp;T</code></pre> |
||||
<p>類似的狀況也會發生在<code><</code>符號上，因為Markdown支援<a href="#html">行內 HTML</a> ，如果你是使用<code><</code>符號作為HTML標籤使用，那Markdown也不會對它做任何轉換，但是如果你是寫：</p> |
||||
<pre><code>4 < 5</code></pre> |
||||
<p>Markdown將會把它轉換為：</p> |
||||
<pre><code>4 &lt; 5</code></pre> |
||||
<p>不過需要注意的是，code範圍內，不論是行內還是區塊，<code><</code>和<code>&</code>兩個符號都<em>一定</em>會被轉換成HTML實體，這項特性讓你可以很容易地用Markdown寫HTML code（和HTML相對而言。在HTML語法中，你要把所有的<code><</code>和<code>&</code>都轉換為 HTML實體，才能在HTML文件裡面寫出HTML code。）</p> |
||||
<hr /> |
||||
<h2 id="block"> |
||||
區塊元素 |
||||
</h2> |
||||
<h3 id="p"> |
||||
段落和換行 |
||||
</h3> |
||||
<p>一個段落是由一個以上相連接的行句組成，而一個以上的空行則會切分出不同的段落（空行的定義是顯示上看起來像是空行，便會被視為空行。比方說，若某一行只包含空白和tab，則該行也會被視為空行），一般的段落不需要用空白或斷行縮排。</p> |
||||
<p>「一個以上相連接的行句組成」這句話其實暗示了Markdown允許段落內的強迫斷行，這個特性和其他大部分的text-to-HTML格式不一樣（包括 MovableType的「Convert Line Breaks」選項），其他的格式會把每個斷行都轉成<code><br /></code>標籤。</p> |
||||
<p>如果你<em>真的</em>想要插入<code><br /></code>標籤的話，在行尾加上兩個以上的空白，然後按enter。</p> |
||||
<p>是的，這確實需要花比較多功夫來插入<code><br /></code>，但是「每個換行都轉換為<code><br /></code>」的方法在Markdown中並不適合， Markdown中email式的<a href="#blockquote">區塊引言</a>和多段落的<a href="#list">清單</a>在使用換行來排版的時候，不但更好用，還更好閱讀。</p> |
||||
<h3 id="header"> |
||||
標題 |
||||
</h3> |
||||
<p>Markdown支援兩種標題的語法，<a href="http://docutils.sourceforge.net/mirror/setext.html">Setext</a>和<a href="http://www.aaronsw.com/2002/atx/">atx</a>形式。</p> |
||||
<p>Setext形式是用底線的形式，利用<code>=</code>（最高階標題）和<code>-</code>（第二階標題），例如：</p> |
||||
<pre><code>This is an H1 |
||||
============= |
||||
|
||||
This is an H2 |
||||
-------------</code></pre> |
||||
<p>任何數量的<code>=</code>和<code>-</code>都可以有效果。</p> |
||||
<p>Atx形式則是在行首插入1到6個 <code>#</code> ，各對應到標題1到6階，例如：</p> |
||||
<pre><code># This is an H1 |
||||
|
||||
## This is an H2 |
||||
|
||||
###### This is an H6</code></pre> |
||||
<p>你可以選擇性地「關閉」atx樣式的標題，這純粹只是美觀用的，若是覺得這樣看起來比較舒適，你就可以在行尾加上<code>#</code>，而行尾的<code>#</code>數量也不用和開頭一樣（行首的井字數量決定標題的階數）：</p> |
||||
<pre><code># This is an H1 # |
||||
|
||||
## This is an H2 ## |
||||
|
||||
### This is an H3 ######</code></pre> |
||||
<h3 id="blockquote"> |
||||
區塊引言 |
||||
</h3> |
||||
<p>Markdown使用email形式的區塊引言，如果你很熟悉如何在email信件中引言，你就知道怎麼在Markdown文件中建立一個區塊引言，那會看起來像是你強迫斷行，然後在每行的最前面加上<code>></code>：</p> |
||||
<pre><code>> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, |
||||
> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. |
||||
> Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. |
||||
> |
||||
> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse |
||||
> id sem consectetuer libero luctus adipiscing.</code></pre> |
||||
<p>Markdown也允許你只在整個段落的第一行最前面加上<code>></code>：</p> |
||||
<pre><code>> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, |
||||
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. |
||||
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. |
||||
|
||||
> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse |
||||
id sem consectetuer libero luctus adipiscing.</code></pre> |
||||
<p>區塊引言可以有階層（例如：引言內的引言），只要根據層數加上不同數量的<code>></code>：</p> |
||||
<pre><code>> This is the first level of quoting. |
||||
> |
||||
> > This is nested blockquote. |
||||
> |
||||
> Back to the first level.</code></pre> |
||||
<p>引言的區塊內也可以使用其他的Markdown語法，包括標題、清單、程式碼區塊等：</p> |
||||
<pre><code>> ## This is a header. |
||||
> |
||||
> 1. This is the first list item. |
||||
> 2. This is the second list item. |
||||
> |
||||
> Here's some example code: |
||||
> |
||||
> return shell_exec("echo $input | $markdown_script");</code></pre> |
||||
<p>任何標準的文字編輯器都能簡單地建立email樣式的引言，例如BBEdit，你可以選取文字後然後從選單中選擇<em>增加引言階層</em>。</p> |
||||
<h3 id="list"> |
||||
清單 |
||||
</h3> |
||||
<p>Markdown支援有序清單和無序清單。</p> |
||||
<p>無序清單使用星號、加號或是減號作為清單標記：</p> |
||||
<pre><code>* Red |
||||
* Green |
||||
* Blue</code></pre> |
||||
<p>等同於：</p> |
||||
<pre><code>+ Red |
||||
+ Green |
||||
+ Blue</code></pre> |
||||
<p>也等同於：</p> |
||||
<pre><code>- Red |
||||
- Green |
||||
- Blue</code></pre> |
||||
<p>有序清單則使用數字接著一個英文句點：</p> |
||||
<pre><code>1. Bird |
||||
2. McHale |
||||
3. Parish</code></pre> |
||||
<p>很重要的一點是，你在清單標記上使用的數字並不會影響輸出的HTML結果，上面的清單所產生的HTML標記為：</p> |
||||
<pre><code><ol> |
||||
<li>Bird</li> |
||||
<li>McHale</li> |
||||
<li>Parish</li> |
||||
</ol></code></pre> |
||||
<p>如果你的清單標記寫成：</p> |
||||
<pre><code>1. Bird |
||||
1. McHale |
||||
1. Parish</code></pre> |
||||
<p>或甚至是：</p> |
||||
<pre><code>3. Bird |
||||
1. McHale |
||||
8. Parish</code></pre> |
||||
<p>你都會得到完全相同的HTML輸出。重點在於，你可以讓Markdown文件的清單數字和輸出的結果相同，或是你懶一點，你可以完全不用在意數字的正確性。</p> |
||||
<p>如果你使用懶惰的寫法，建議第一個項目最好還是從「1.」開始，因為Markdown未來可能會支援有序清單的start屬性。</p> |
||||
<p>清單項目標記通常是放在最左邊，但是其實也可以縮排，最多三個空白，項目標記後面則一定要接著至少一個空白或tab。</p> |
||||
<p>要讓清單看起來更漂亮，你可以把內容用固定的縮排整理好：</p> |
||||
<pre><code>* Lorem ipsum dolor sit amet, consectetuer adipiscing elit. |
||||
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, |
||||
viverra nec, fringilla in, laoreet vitae, risus. |
||||
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit. |
||||
Suspendisse id sem consectetuer libero luctus adipiscing.</code></pre> |
||||
<p>但是如果你很懶，那也不一定需要：</p> |
||||
<pre><code>* Lorem ipsum dolor sit amet, consectetuer adipiscing elit. |
||||
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, |
||||
viverra nec, fringilla in, laoreet vitae, risus. |
||||
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit. |
||||
Suspendisse id sem consectetuer libero luctus adipiscing.</code></pre> |
||||
<p>如果清單項目間用空行分開， Markdown會把項目的內容在輸出時用<code><p></code>標籤包起來，舉例來說：</p> |
||||
<pre><code>* Bird |
||||
* Magic</code></pre> |
||||
<p>會被轉換為：</p> |
||||
<pre><code><ul> |
||||
<li>Bird</li> |
||||
<li>Magic</li> |
||||
</ul></code></pre> |
||||
<p>但是這個：</p> |
||||
<pre><code>* Bird |
||||
|
||||
* Magic</code></pre> |
||||
<p>會被轉換為：</p> |
||||
<pre><code><ul> |
||||
<li><p>Bird</p></li> |
||||
<li><p>Magic</p></li> |
||||
</ul></code></pre> |
||||
<p>清單項目可以包含多個段落，每個項目下的段落都必須縮排4個空白或是一個tab：</p> |
||||
<pre><code>1. This is a list item with two paragraphs. Lorem ipsum dolor |
||||
sit amet, consectetuer adipiscing elit. Aliquam hendrerit |
||||
mi posuere lectus. |
||||
|
||||
Vestibulum enim wisi, viverra nec, fringilla in, laoreet |
||||
vitae, risus. Donec sit amet nisl. Aliquam semper ipsum |
||||
sit amet velit. |
||||
|
||||
2. Suspendisse id sem consectetuer libero luctus adipiscing.</code></pre> |
||||
<p>如果你每行都有縮排，看起來會看好很多，當然，再次地，如果你很懶惰，Markdown也允許：</p> |
||||
<pre><code>* This is a list item with two paragraphs. |
||||
|
||||
This is the second paragraph in the list item. You're |
||||
only required to indent the first line. Lorem ipsum dolor |
||||
sit amet, consectetuer adipiscing elit. |
||||
|
||||
* Another item in the same list.</code></pre> |
||||
<p>如果要在清單項目內放進引言，那<code>></code>就需要縮排：</p> |
||||
<pre><code>* A list item with a blockquote: |
||||
|
||||
> This is a blockquote |
||||
> inside a list item.</code></pre> |
||||
<p>如果要放程式碼區塊的話，該區塊就需要縮排<em>兩次</em>，也就是8個空白或是兩個tab：</p> |
||||
<pre><code>* A list item with a code block: |
||||
|
||||
<code goes here></code></pre> |
||||
<p>當然，項目清單很可能會不小心產生，像是下面這樣的寫法：</p> |
||||
<pre><code>1986. What a great season.</code></pre> |
||||
<p>換句話說，也就是在行首出現<em>數字－句點－空白</em>，要避免這樣的狀況，你可以在句點前面加上反斜線。</p> |
||||
<pre><code>1986\. What a great season.</code></pre> |
||||
<h3 id="precode"> |
||||
程式碼區塊 |
||||
</h3> |
||||
<p>和程式相關的寫作或是標籤語言原始碼通常會有已經排版好的程式碼區塊，通常這些區塊我們並不希望它以一般段落文件的方式去排版，而是照原來的樣子顯示，Markdown會用<code><pre></code>和<code><code></code>標籤來把程式碼區塊包起來。</p> |
||||
<p>要在Markdown中建立程式碼區塊很簡單，只要簡單地縮排4個空白或是1個tab就可以，例如，下面的輸入：</p> |
||||
<pre><code>This is a normal paragraph: |
||||
|
||||
This is a code block.</code></pre> |
||||
<p>Markdown會轉換成：</p> |
||||
<pre><code><p>This is a normal paragraph:</p> |
||||
|
||||
<pre><code>This is a code block. |
||||
</code></pre></code></pre> |
||||
<p>這個每行一階的縮排（4個空白或是1個tab），都會被移除，例如：</p> |
||||
<pre><code>Here is an example of AppleScript: |
||||
|
||||
tell application "Foo" |
||||
beep |
||||
end tell</code></pre> |
||||
<p>會被轉換為：</p> |
||||
<pre><code><p>Here is an example of AppleScript:</p> |
||||
|
||||
<pre><code>tell application "Foo" |
||||
beep |
||||
end tell |
||||
</code></pre></code></pre> |
||||
<p>一個程式碼區塊會一直持續到沒有縮排的那一行（或是文件結尾）。</p> |
||||
<p>在程式碼區塊裡面，<code>&</code>、<code><</code>和<code>></code>會自動轉成HTML實體，這樣的方式讓你非常容易使用Markdown插入範例用的HTML原始碼，只需要複製貼上，再加上縮排就可以了，剩下的Markdown都會幫你處理，例如：</p> |
||||
<pre><code> <div class="footer"> |
||||
&copy; 2004 Foo Corporation |
||||
</div></code></pre> |
||||
<p>會被轉換為：</p> |
||||
<pre><code><pre><code>&lt;div class="footer"&gt; |
||||
&amp;copy; 2004 Foo Corporation |
||||
&lt;/div&gt; |
||||
</code></pre></code></pre> |
||||
<p>程式碼區塊中，一般的Markdown語法不會被轉換，像是星號便只是星號，這表示你可以很容易地以Markdown語法撰寫Markdown語法相關的文件。</p> |
||||
<h3 id="hr"> |
||||
分隔線 |
||||
</h3> |
||||
<p>你可以在一行中用三個或以上的星號、減號、底線來建立一個分隔線，行內不能有其他東西。你也可以在星號中間插入空白。下面每種寫法都可以建立分隔線：</p> |
||||
<pre><code>* * * |
||||
|
||||
*** |
||||
|
||||
***** |
||||
|
||||
- - - |
||||
|
||||
---------------------------------------</code></pre> |
||||
<hr /> |
||||
<h2 id="span"> |
||||
區段元素 |
||||
</h2> |
||||
<h3 id="link"> |
||||
連結 |
||||
</h3> |
||||
<p>Markdown支援兩種形式的連結語法：<em>行內</em>和<em>參考</em>兩種形式。</p> |
||||
<p>不管是哪一種，連結的文字都是用 [方括號] 來標記。</p> |
||||
<p>要建立一個行內形式的連結，只要在方塊括號後面馬上接著括號並插入網址連結即可，如果你還想要加上連結的title文字，只要在網址後面，用雙引號把title文字包起來即可，例如：</p> |
||||
<pre><code>This is [an example](http://example.com/ "Title") inline link. |
||||
|
||||
[This link](http://example.net/) has no title attribute.</code></pre> |
||||
<p>會產生：</p> |
||||
<pre><code><p>This is <a href="http://example.com/" title="Title"> |
||||
an example</a> inline link.</p> |
||||
|
||||
<p><a href="http://example.net/">This link</a> has no |
||||
title attribute.</p></code></pre> |
||||
<p>如果你是要連結到同樣主機的資源，你可以使用相對路徑：</p> |
||||
<pre><code>See my [About](/about/) page for details. </code></pre> |
||||
<p>參考形式的連結使用另外一個方括號接在連結文字的括號後面，而在第二個方括號裡面要填入用以辨識連結的標籤：</p> |
||||
<pre><code>This is [an example][id] reference-style link.</code></pre> |
||||
<p>你也可以選擇性地在兩個方括號中間加上空白：</p> |
||||
<pre><code>This is [an example] [id] reference-style link.</code></pre> |
||||
<p>接著，在文件的任意處，你可以把這個標籤的連結內容定義出來：</p> |
||||
<pre><code>[id]: http://example.com/ "Optional Title Here"</code></pre> |
||||
<p>連結定義的形式為：</p> |
||||
<ul> |
||||
<li>方括號，裡面輸入連結的辨識用標籤</li> |
||||
<li>接著一個冒號</li> |
||||
<li>接著一個以上的空白或tab</li> |
||||
<li>接著連結的網址</li> |
||||
<li>選擇性地接著title內容，可以用單引號、雙引號或是括弧包著</li> |
||||
</ul> |
||||
<p>下面這三種連結的定義都是相同：</p> |
||||
<pre><code>[foo]: http://example.com/ "Optional Title Here" |
||||
[foo]: http://example.com/ 'Optional Title Here' |
||||
[foo]: http://example.com/ (Optional Title Here)</code></pre> |
||||
<p><strong>請注意：</strong>有一個已知的問題是Markdown.pl 1.0.1會忽略單引號包起來的連結title。</p> |
||||
<p>連結網址也可以用角括號包起來：</p> |
||||
<pre><code>[id]: <http://example.com/> "Optional Title Here"</code></pre> |
||||
<p>你也可以把title屬性放到下一行，也可以加一些縮排，網址太長的話，這樣會比較好看：</p> |
||||
<pre><code>[id]: http://example.com/longish/path/to/resource/here |
||||
"Optional Title Here"</code></pre> |
||||
<p>網址定義只有在產生連結的時候用到，並不會直接出現在文件之中。</p> |
||||
<p>連結辨識標籤可以有字母、數字、空白和標點符號，但是並<em>不</em>區分大小寫，因此下面兩個連結是一樣的：</p> |
||||
<pre><code>[link text][a] |
||||
[link text][A]</code></pre> |
||||
<p><em>預設的連結標籤</em>功能讓你可以省略指定連結標籤，這種情形下，連結標籤和連結文字會視為相同，要用預設連結標籤只要在連結文字後面加上一個空的方括號，如果你要讓“Google”連結到google.com，你可以簡化成：</p> |
||||
<pre><code>[Google][]</code></pre> |
||||
<p>然後定義連結內容：</p> |
||||
<pre><code>[Google]: http://google.com/</code></pre> |
||||
<p>由於連結文字可能包含空白，所以這種簡化的標籤內也可以包含多個文字：</p> |
||||
<pre><code>Visit [Daring Fireball][] for more information.</code></pre> |
||||
<p>然後接著定義連結：</p> |
||||
<pre><code>[Daring Fireball]: http://daringfireball.net/</code></pre> |
||||
<p>連結的定義可以放在文件中的任何一個地方，我比較偏好直接放在連結出現段落的後面，你也可以把它放在文件最後面，就像是註解一樣。</p> |
||||
<p>下面是一個參考式連結的範例：</p> |
||||
<pre><code>I get 10 times more traffic from [Google] [1] than from |
||||
[Yahoo] [2] or [MSN] [3]. |
||||
|
||||
[1]: http://google.com/ "Google" |
||||
[2]: http://search.yahoo.com/ "Yahoo Search" |
||||
[3]: http://search.msn.com/ "MSN Search"</code></pre> |
||||
<p>如果改成用連結名稱的方式寫：</p> |
||||
<pre><code>I get 10 times more traffic from [Google][] than from |
||||
[Yahoo][] or [MSN][]. |
||||
|
||||
[google]: http://google.com/ "Google" |
||||
[yahoo]: http://search.yahoo.com/ "Yahoo Search" |
||||
[msn]: http://search.msn.com/ "MSN Search"</code></pre> |
||||
<p>上面兩種寫法都會產生下面的HTML。</p> |
||||
<pre><code><p>I get 10 times more traffic from <a href="http://google.com/" |
||||
title="Google">Google</a> than from |
||||
<a href="http://search.yahoo.com/" title="Yahoo Search">Yahoo</a> |
||||
or <a href="http://search.msn.com/" title="MSN Search">MSN</a>.</p></code></pre> |
||||
<p>下面是用行內形式寫的同樣一段內容的Markdown文件，提供作為比較之用：</p> |
||||
<pre><code>I get 10 times more traffic from [Google](http://google.com/ "Google") |
||||
than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or |
||||
[MSN](http://search.msn.com/ "MSN Search").</code></pre> |
||||
<p>參考式的連結其實重點不在於它比較好寫，而是它比較好讀，比較一下上面的範例，使用參考式的文章本身只有81個字元，但是用行內形式的連結卻會增加到176個字元，如果是用純HTML格式來寫，會有234個字元，在HTML格式中，標籤比文字還要多。</p> |
||||
<p>使用Markdown的參考式連結，可以讓文件更像是瀏覽器最後產生的結果，讓你可以把一些標記相關的資訊移到段落文字之外，你就可以增加連結而不讓文章的閱讀感覺被打斷。</p> |
||||
<h3 id="em"> |
||||
強調 |
||||
</h3> |
||||
<p>Markdown使用星號（<code>*</code>）和底線（<code>_</code>）作為標記強調字詞的符號，被<code>*</code>或<code>_</code>包圍的字詞會被轉成用<code><em></code>標籤包圍，用兩個<code>*</code>或<code>_</code>包起來的話，則會被轉成<code><strong></code>，例如：</p> |
||||
<pre><code>*single asterisks* |
||||
|
||||
_single underscores_ |
||||
|
||||
**double asterisks** |
||||
|
||||
__double underscores__</code></pre> |
||||
<p>會轉成：</p> |
||||
<pre><code><em>single asterisks</em> |
||||
|
||||
<em>single underscores</em> |
||||
|
||||
<strong>double asterisks</strong> |
||||
|
||||
<strong>double underscores</strong></code></pre> |
||||
<p>你可以隨便用你喜歡的樣式，唯一的限制是，你用什麼符號開啟標籤，就要用什麼符號結束。</p> |
||||
<p>強調也可以直接插在文字中間：</p> |
||||
<pre><code>un*frigging*believable</code></pre> |
||||
<p>但是如果你的 <code>*</code> 和 <code>_</code> 兩邊都有空白的話，它們就只會被當成普通的符號。</p> |
||||
<p>如果要在文字前後直接插入普通的星號或底線，你可以用反斜線：</p> |
||||
<pre><code>\*this text is surrounded by literal asterisks\*</code></pre> |
||||
<h3 id="code"> |
||||
程式碼 |
||||
</h3> |
||||
<p>如果要標記一小段行內程式碼，你可以用反引號把它包起來（<code>`</code>），例如：</p> |
||||
<pre><code>Use the `printf()` function.</code></pre> |
||||
<p>會產生：</p> |
||||
<pre><code><p>Use the <code>printf()</code> function.</p></code></pre> |
||||
<p>如果要在程式碼區段內插入反引號，你可以用多個反引號來開啟和結束程式碼區段：</p> |
||||
<pre><code>``There is a literal backtick (`) here.``</code></pre> |
||||
<p>這段語法會產生：</p> |
||||
<pre><code><p><code>There is a literal backtick (`) here.</code></p></code></pre> |
||||
<p>程式碼區段的起始和結束端都可以放入一個空白，起始端後面一個，結束端前面一個，這樣你就可以在區段的一開始就插入反引號：</p> |
||||
<pre><code>A single backtick in a code span: `` ` `` |
||||
|
||||
A backtick-delimited string in a code span: `` `foo` ``</code></pre> |
||||
<p>會產生：</p> |
||||
<pre><code><p>A single backtick in a code span: <code>`</code></p> |
||||
|
||||
<p>A backtick-delimited string in a code span: <code>`foo`</code></p></code></pre> |
||||
<p>在程式碼區段內，<code>&</code>和角括號都會被轉成HTML實體，這樣會比較容易插入HTML原始碼，Markdown會把下面這段：</p> |
||||
<pre><code>Please don't use any `<blink>` tags.</code></pre> |
||||
<p>轉為：</p> |
||||
<pre><code><p>Please don't use any <code>&lt;blink&gt;</code> tags.</p></code></pre> |
||||
<p>你也可以這樣寫：</p> |
||||
<pre><code>`&#8212;` is the decimal-encoded equivalent of `&mdash;`.</code></pre> |
||||
<p>以產生：</p> |
||||
<pre><code><p><code>&amp;#8212;</code> is the decimal-encoded |
||||
equivalent of <code>&amp;mdash;</code>.</p></code></pre> |
||||
<h3 id="img"> |
||||
圖片 |
||||
</h3> |
||||
<p>很明顯地，要在純文字應用中設計一個「自然」的語法來插入圖片是有一定難度的。</p> |
||||
<p>Markdown使用一種和連結很相似的語法來標記圖片，同樣也允許兩種樣式：<em>行內</em>和<em>參考</em>。</p> |
||||
<p>行內圖片的語法看起來像是：</p> |
||||
<pre><code> |
||||
|
||||
</code></pre> |
||||
<p>詳細敘述如下：</p> |
||||
<ul> |
||||
<li>一個驚嘆號<code>!</code></li> |
||||
<li>接著一個方括號，裡面放上圖片的替代文字</li> |
||||
<li>接著一個普通括號，裡面放上圖片的網址，最後還可以用引號包住並加上 選擇性的’title’文字。</li> |
||||
</ul> |
||||
<p>參考式的圖片語法則長得像這樣：</p> |
||||
<pre><code>![Alt text][id]</code></pre> |
||||
<p>「id」是圖片參考的名稱，圖片參考的定義方式則和連結參考一樣：</p> |
||||
<pre><code>[id]: url/to/image "Optional title attribute"</code></pre> |
||||
<p>到目前為止， Markdown還沒有辦法指定圖片的寬高，如果你需要的話，你可以使用普通的<code><img></code>標籤。</p> |
||||
<hr /> |
||||
<h2 id="misc"> |
||||
其他 |
||||
</h2> |
||||
<h3 id="autolink"> |
||||
自動連結 |
||||
</h3> |
||||
<p>Markdown支援比較簡短的自動連結形式來處理網址和電子郵件信箱，只要是用角括號包起來，Markdown就會自動把它轉成連結，連結的文字就和連結位置一樣，例如：</p> |
||||
<pre><code><http://example.com/></code></pre> |
||||
<p>Markdown會轉為：</p> |
||||
<pre><code><a href="http://example.com/">http://example.com/</a></code></pre> |
||||
<p>自動的郵件連結也很類似，只是Markdown會先做一個編碼轉換的過程，把文字字元轉成16進位碼的HTML實體，這樣的格式可以混淆一些不好的信箱地址收集機器人，例如：</p> |
||||
<pre><code><address@example.com></code></pre> |
||||
<p>Markdown會轉成：</p> |
||||
<pre><code><a href="&#x6D;&#x61;i&#x6C;&#x74;&#x6F;:&#x61;&#x64;&#x64;&#x72;&#x65; |
||||
&#115;&#115;&#64;&#101;&#120;&#x61;&#109;&#x70;&#x6C;e&#x2E;&#99;&#111; |
||||
&#109;">&#x61;&#x64;&#x64;&#x72;&#x65;&#115;&#115;&#64;&#101;&#120;&#x61; |
||||
&#109;&#x70;&#x6C;e&#x2E;&#99;&#111;&#109;</a></code></pre> |
||||
<p>在瀏覽器裡面，這段字串會變成一個可以點擊的「address@example.com」連結。</p> |
||||
<p>（這種作法雖然可以混淆不少的機器人，但並無法全部擋下來，不過這樣也比什麼都不做好些。無論如何，公開你的信箱終究會引來廣告信件的。）</p> |
||||
<h3 id="backslash"> |
||||
跳脫字元 |
||||
</h3> |
||||
<p>Markdown可以利用反斜線來插入一些在語法中有其他意義的符號，例如：如果你想要用星號加在文字旁邊的方式來做出強調效果（但不用<code><em></code>標籤），你可以在星號的前面加上反斜線：</p> |
||||
<pre><code>\*literal asterisks\*</code></pre> |
||||
<p>Markdown支援在下面這些符號前面加上反斜線來幫助插入普通的符號：</p> |
||||
<pre><code>\ 反斜線 |
||||
` 反引號 |
||||
* 星號 |
||||
_ 底線 |
||||
{} 大括號 |
||||
[] 方括號 |
||||
() 括號 |
||||
# 井字號 |
||||
+ 加號 |
||||
- 減號 |
||||
. 英文句點 |
||||
! 驚嘆號</code></pre> |
||||
<h2 id="acknowledgement"> |
||||
感謝 |
||||
</h2> |
||||
<p>感謝<a href="https://twitter.com/#!/leafy7382">leafy7382</a>協助翻譯，<a href="http://iamhlb.com/">hlb</a>、<a href="http://twitter.com/randylien">Randylien</a>幫忙潤稿，<a href="https://twitter.com/#!/ethantw">ethantw</a>的<a href="http://css.hanzi.co/">漢字標準格式</a>，<a href="http://kidwm.net/">WM</a>回報文字錯誤。</p> |
||||
|
||||
</div> |
||||
|
||||
<footer>Made with <3 by <a href="https://othree.net">othree</a>.</footer> |
||||
|
||||
<script type="text/javascript"> |
||||
var _gaq = _gaq || []; |
||||
_gaq.push(["_setAccount", "UA-21880461-1"]); |
||||
_gaq.push(["_trackPageview"]); |
||||
|
||||
(function () { |
||||
var ga = document.createElement("script"); |
||||
ga.type = "text/javascript"; |
||||
ga.async = true; |
||||
ga.src = |
||||
("https:" == document.location.protocol |
||||
? "https://ssl" |
||||
: "http://www") + ".google-analytics.com/ga.js"; |
||||
var s = document.getElementsByTagName("script")[0]; |
||||
s.parentNode.insertBefore(ga, s); |
||||
})(); |
||||
</script> |
||||
|
||||
<script src="https://use.typekit.net/gib3xul.js"></script> |
||||
<script> |
||||
try { |
||||
Typekit.load(); |
||||
} catch (e) {} |
||||
</script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Han/3.2.2/han.min.js"></script> |
||||
</body> |
||||
</html> |
||||
@ -1,268 +0,0 @@
@@ -1,268 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="zh-TW" class="han-biaodian-pro-cns han-la"> |
||||
<head> |
||||
<meta charset="UTF-8" /> |
||||
<title>Markdown 語法說明</title> |
||||
<link |
||||
rel="stylesheet" |
||||
media="all" |
||||
href="//cdnjs.cloudflare.com/ajax/libs/Han/3.2.2/han.min.css" |
||||
/> |
||||
<link rel="stylesheet" media="all" href="stylesheets/main.css" /> |
||||
<meta property="og:title" content="Markdown 語法說明" /> |
||||
<meta property="og:url" content="https://markdown.tw/" /> |
||||
<meta property="og:type" content="website" /> |
||||
<meta |
||||
property="og:description" |
||||
content="Markdown 是很簡單的純文件格式，由於語法設計得好，近幾年廣泛應用在各種領域，包括 Github、Stack Overflow 等知名的網路服務都使用它，本網頁為該語法的中文說明" |
||||
/> |
||||
<meta |
||||
property="og:image" |
||||
content="https://markdown.tw/images/208x128.png" |
||||
/> |
||||
<meta property="og:image:width" content="208" /> |
||||
<meta property="og:image:height" content="128" /> |
||||
</head> |
||||
<body |
||||
class="tk-source-han-sans-traditional" |
||||
style="font-family: -apple-system;" |
||||
> |
||||
<nav> |
||||
<a href="/">文件</a> |
||||
<a href="/resources.html">資源</a> |
||||
<a href="http://commonmark.org/" |
||||
>標準<img |
||||
src="external-link-alt-solid.svg" |
||||
width="12" |
||||
height="12" |
||||
alt="" |
||||
style="margin: 1px 0 -1px 3px;" |
||||
/></a> |
||||
<a href="https://github.com/othree/markdown-syntax-zhtw/issues" |
||||
>回報錯誤<img |
||||
src="external-link-alt-solid.svg" |
||||
width="12" |
||||
height="12" |
||||
alt="" |
||||
style="margin: 1px 0 -1px 3px;" |
||||
/></a> |
||||
</nav> |
||||
|
||||
<div class="wikistyle"> |
||||
<h1 id="markdown-資源">Markdown 資源</h1> |
||||
<p><img src="https://markdown.tw/images/208x128.png" /></p> |
||||
<h2 id="spec">Spec</h2> |
||||
<ul> |
||||
<li><a href="http://commonmark.org/">CommonMark</a></li> |
||||
</ul> |
||||
<h2 id="logo">Logo</h2> |
||||
<ul> |
||||
<li><a href="http://dcurt.is/the-markdown-mark">The Markdown Mark</a></li> |
||||
</ul> |
||||
<h2 id="社群">社群</h2> |
||||
<ul> |
||||
<li><a href="https://www.facebook.com/groups/830853873715381/">Facebook Markdown 台灣 Group</a></li> |
||||
</ul> |
||||
<h2 id="編輯器">編輯器</h2> |
||||
<h3 id="寫作用編輯器">寫作用編輯器</h3> |
||||
<ul> |
||||
<li>OSX |
||||
<ul> |
||||
<li><a href="http://typora.io/">Typora</a></li> |
||||
<li><a href="http://macdown.uranusjr.com/">MacDown</a></li> |
||||
<li><a href="http://bywordapp.com/">Byword</a></li> |
||||
<li><a href="http://www.iawriter.com/mac/">iA Writer</a></li> |
||||
<li><a href="http://mouapp.com/">Mouapp</a></li> |
||||
<li><a href="http://www.texts.io/">TEXTS</a></li> |
||||
<li><a href="http://kobito.qiita.com/">Kobito</a></li> |
||||
</ul></li> |
||||
<li>Linux |
||||
<ul> |
||||
<li><a href="http://sourceforge.net/p/retext/home/ReText/">ReText</a></li> |
||||
<li><a href="http://uberwriter.wolfvollprecht.de/">UberWriter</a></li> |
||||
</ul></li> |
||||
<li>Windows |
||||
<ul> |
||||
<li><a href="http://markdownpad.com/">MarkdownPad</a></li> |
||||
<li><a href="http://www.texts.io/">TEXTS</a></li> |
||||
<li><a href="https://miu.0x142857.com">Miu</a></li> |
||||
</ul></li> |
||||
<li>iOS |
||||
<ul> |
||||
<li><a href="http://bywordapp.com/">Byword</a></li> |
||||
<li><a href="http://www.iawriter.com/ipad/">iA Writer for iPad</a></li> |
||||
<li><a href="http://www.iawriter.com/iphone/">iA Writer for iPhone</a></li> |
||||
</ul></li> |
||||
<li>All |
||||
<ul> |
||||
<li><a href="https://yhatt.github.io/marp/">Marp</a>, Markdown to slide</li> |
||||
</ul></li> |
||||
</ul> |
||||
<h3 id="預覽">預覽</h3> |
||||
<ul> |
||||
<li>OSX |
||||
<ul> |
||||
<li><a href="https://itunes.apple.com/us/app/marked/id448925439">Marked</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
<h3 id="通用文字編輯器">通用文字編輯器</h3> |
||||
<ul> |
||||
<li><a href="http://www.sublimetext.com/">Sublime Text</a></li> |
||||
<li>Vim |
||||
<ul> |
||||
<li><a href="https://github.com/plasticboy/vim-markdown">plasticboy/vim-markdown</a></li> |
||||
<li><a href="https://github.com/tpope/vim-markdown">tpope/vim-markdown</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
<h3 id="網頁文字編輯器">網頁文字編輯器</h3> |
||||
<ul> |
||||
<li><a href="http://ace.ajax.org/">Ace</a></li> |
||||
<li><a href="http://codemirror.net/">CodeMirror</a></li> |
||||
<li><a href="http://dillinger.io/">Dillinger</a></li> |
||||
<li><a href="http://oscargodson.github.io/EpicEditor/">EpicEditor</a></li> |
||||
<li><a href="https://github.com/bianchimro/markgiu">Markgiu</a></li> |
||||
</ul> |
||||
<h3 id="瀏覽器-extension">瀏覽器 Extension</h3> |
||||
<ul> |
||||
<li><a href="https://github.com/adam-p/markdown-here/">Markdown Here</a></li> |
||||
</ul> |
||||
<h2 id="變形版-markdown">變形版 Markdown</h2> |
||||
<ul> |
||||
<li><a href="https://help.github.com/articles/github-flavored-markdown">GitHub Flavored Markdown</a> |
||||
<ul> |
||||
<li><a href="https://github.github.com/gfm/">Spec</a></li> |
||||
<li><a href="https://github.com/github/cmark-gfm">Source</a></li> |
||||
</ul></li> |
||||
<li><a href="https://gitlab.com/help/user/markdown">GitLab Flavored Markdown</a></li> |
||||
<li><a href="http://kramdown.rubyforge.org/quickref.html#headers">kramdown</a></li> |
||||
<li><a href="http://fletcherpenney.net/multimarkdown/">MultiMarkdown</a></li> |
||||
<li><a href="http://johnmacfarlane.net/pandoc/README.html#pandocs-markdown">Pandoc’s markdown</a> |
||||
<ul> |
||||
<li><a href="http://pages.tzengyuxio.me/pandoc/">Pandoc’s Markdown 語法中文翻譯</a></li> |
||||
</ul></li> |
||||
<li><a href="http://michelf.ca/projects/php-markdown/extra/">PHP Markdown Extra</a></li> |
||||
<li><a href="https://rmarkdown.rstudio.com/">R Markdown</a></li> |
||||
<li><a href="http://markua.com/">Maruka</a></li> |
||||
<li><a href="https://apiblueprint.org/">API Blueprint</a></li> |
||||
<li><a href="https://apiblueprint.org/documentation/mson/tutorial.html">MSON</a></li> |
||||
<li><a href="https://www.reddit.com/wiki/markdown">Reddit-flavored Markdown</a> |
||||
<ul> |
||||
<li><a href="https://github.com/zeantsoi/snoomark-binding">Binding</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
<h2 id="引擎">引擎</h2> |
||||
<ul> |
||||
<li>C |
||||
<ul> |
||||
<li><a href="https://github.com/jgm/cmark">cmark</a></li> |
||||
<li><a href="https://github.com/github/cmark-gfm">cmark-gfm</a></li> |
||||
<li><a href="https://github.com/vmg/sundown">Sundown</a></li> |
||||
</ul></li> |
||||
<li>JavaScript |
||||
<ul> |
||||
<li><a href="https://github.com/jgm/commonmark.js">commonmark.js</a></li> |
||||
<li><a href="https://github.com/cky/wmd">showdown</a>, not maintained any more</li> |
||||
<li><a href="https://github.com/StackExchange/pagedown">pagedown</a>, StackOverflow</li> |
||||
<li><a href="https://github.com/coreyti/showdown">coreyti/showdown</a></li> |
||||
<li><a href="https://github.com/chjj/marked">marked</a></li> |
||||
<li><a href="https://jonschlinkert.github.io/remarkable/demo/">Remarkable</a></li> |
||||
</ul></li> |
||||
<li>PHP |
||||
<ul> |
||||
<li><a href="http://michelf.ca/projects/php-markdown/">PHP Markdown</a></li> |
||||
</ul></li> |
||||
<li>Python |
||||
<ul> |
||||
<li><a href="https://pypi.python.org/pypi/CommonMark">CommonMark</a></li> |
||||
</ul></li> |
||||
<li>Ruby |
||||
<ul> |
||||
<li><a href="https://github.com/vmg/redcarpet">Redcarpet</a></li> |
||||
<li><a href="https://github.com/bhollis/maruku">Maruku</a></li> |
||||
</ul></li> |
||||
<li>Rust |
||||
<ul> |
||||
<li><a href="https://github.com/kivikakk/comrak">comark</a></li> |
||||
<li><a href="https://github.com/raphlinus/pulldown-cmark">pulldown-cmark</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
<h2 id="反向引擎">反向引擎</h2> |
||||
<ul> |
||||
<li><a href="https://leeoniya.github.io/reMarked.js/">reMarked.js</a></li> |
||||
</ul> |
||||
<h2 id="其它用途引擎">其它用途引擎</h2> |
||||
<ul> |
||||
<li><a href="https://anydown.github.io/maildown/">maildown</a>, 轉為日本常用商業郵件格式</li> |
||||
<li><a href="https://conv.denshochan.com/tw/markdown">電電 Markdown</a>，擴充語法，轉為電子書，非開源</li> |
||||
<li><a href="https://github.com/mdx-js/mdx">mdx</a> Markdown in JSX</li> |
||||
<li><a href="https://github.com/jxnblk/mdx-deck">mdx-deck</a> MDX-based presentation decks</li> |
||||
<li><a href="https://github.com/jamesknelson/mdxc">mdxc</a> Convert markdown to React Component</li> |
||||
</ul> |
||||
<h2 id="blog-服務">Blog 服務</h2> |
||||
<ul> |
||||
<li><a href="http://wordpress.com/">WordPress.com</a></li> |
||||
<li><a href="http://logdown.com/">logdown</a></li> |
||||
</ul> |
||||
<h2 id="blog-系統">Blog 系統</h2> |
||||
<ul> |
||||
<li><a href="http://wordpress.org/">WordPress</a></li> |
||||
<li><a href="http://www.movabletype.org/">MOVABLETYPE</a></li> |
||||
</ul> |
||||
<h2 id="其它服務">其它服務</h2> |
||||
<ul> |
||||
<li><a href="https://hackmd.io/">HackMD</a></li> |
||||
</ul> |
||||
<h2 id="css">CSS</h2> |
||||
<ul> |
||||
<li><a href="http://jasonm23.github.io/markdown-css-themes/">Markdown css themes</a></li> |
||||
<li><a href="http://mrcoles.com/demo/markdown-css/">Markdown.css</a></li> |
||||
</ul> |
||||
<h2 id="其他工具">其他工具</h2> |
||||
<ul> |
||||
<li><a href="http://www.stack.nl/~dimitri/doxygen/manual/markdown.html">Doxygen</a></li> |
||||
</ul> |
||||
<h2 id="標準">標準</h2> |
||||
<ul> |
||||
<li><a href="http://daringfireball.net/projects/markdown/">Markdown</a></li> |
||||
<li><a href="http://www.codinghorror.com/blog/2012/10/the-future-of-markdown.html">The Future of Markdown</a></li> |
||||
<li><a href="http://www.w3.org/community/markdown/">W3C Markdown Community Group</a></li> |
||||
<li><a href="http://www.w3.org/community/markdown/wiki/Main_Page">W3C Markdown Community Group wiki</a></li> |
||||
</ul> |
||||
<h2 id="文章">文章</h2> |
||||
<ul> |
||||
<li><a href="https://blog.codinghorror.com/standard-flavored-markdown/">Standard Flavored Markdown</a> - 標準化緣起</li> |
||||
</ul> |
||||
<h2 id="感謝">感謝</h2> |
||||
<p>感謝 <a href="http://kidwm.net/">WM</a> 協助整理</p> |
||||
|
||||
</div> |
||||
|
||||
<footer>Made with <3 by <a href="https://othree.net">othree</a>.</footer> |
||||
|
||||
<script type="text/javascript"> |
||||
var _gaq = _gaq || []; |
||||
_gaq.push(["_setAccount", "UA-21880461-1"]); |
||||
_gaq.push(["_trackPageview"]); |
||||
|
||||
(function () { |
||||
var ga = document.createElement("script"); |
||||
ga.type = "text/javascript"; |
||||
ga.async = true; |
||||
ga.src = |
||||
("https:" == document.location.protocol |
||||
? "https://ssl" |
||||
: "http://www") + ".google-analytics.com/ga.js"; |
||||
var s = document.getElementsByTagName("script")[0]; |
||||
s.parentNode.insertBefore(ga, s); |
||||
})(); |
||||
</script> |
||||
|
||||
<script src="https://use.typekit.net/gib3xul.js"></script> |
||||
<script> |
||||
try { |
||||
Typekit.load(); |
||||
} catch (e) {} |
||||
</script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Han/3.2.2/han.min.js"></script> |
||||
</body> |
||||
</html> |
||||
@ -1,207 +0,0 @@
@@ -1,207 +0,0 @@
|
||||
<h1>Markdown 資源</h1> |
||||
|
||||
<p><img src="https://markdown.tw/images/208x128.png" alt="Markdown" title="" /></p> |
||||
|
||||
<h2>Spec</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://commonmark.org/">CommonMark</a></li> |
||||
</ul> |
||||
|
||||
<h2>Logo</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://dcurt.is/the-markdown-mark">The Markdown Mark</a></li> |
||||
</ul> |
||||
|
||||
<h2>社群</h2> |
||||
|
||||
<ul> |
||||
<li><a href="https://www.facebook.com/groups/830853873715381/">Facebook Markdown 台灣 Group</a></li> |
||||
</ul> |
||||
|
||||
<h2>編輯器</h2> |
||||
|
||||
<h3>寫作用編輯器</h3> |
||||
|
||||
<ul> |
||||
<li>OSX |
||||
<ul> |
||||
<li><a href="http://typora.io/">Typora</a></li> |
||||
<li><a href="http://macdown.uranusjr.com/">MacDown</a></li> |
||||
<li><a href="http://bywordapp.com/">Byword</a></li> |
||||
<li><a href="http://www.iawriter.com/mac/">iA Writer</a></li> |
||||
<li><a href="http://mouapp.com/">Mouapp</a></li> |
||||
<li><a href="http://www.texts.io/">TEXTS</a></li> |
||||
<li><a href="http://kobito.qiita.com/">Kobito</a></li> |
||||
</ul></li> |
||||
<li>Linux |
||||
<ul> |
||||
<li><a href="http://sourceforge.net/p/retext/home/ReText/">ReText</a></li> |
||||
<li><a href="http://uberwriter.wolfvollprecht.de/">UberWriter</a></li> |
||||
</ul></li> |
||||
<li>Windows |
||||
<ul> |
||||
<li><a href="http://markdownpad.com/">MarkdownPad</a></li> |
||||
<li><a href="http://www.texts.io/">TEXTS</a></li> |
||||
<li><a href="https://miu.0x142857.com">Miu</a></li> |
||||
</ul></li> |
||||
<li>iOS |
||||
<ul> |
||||
<li><a href="http://bywordapp.com/">Byword</a></li> |
||||
<li><a href="http://www.iawriter.com/ipad/">iA Writer for iPad</a></li> |
||||
<li><a href="http://www.iawriter.com/iphone/">iA Writer for iPhone</a></li> |
||||
</ul></li> |
||||
<li>All |
||||
<ul> |
||||
<li><a href="https://yhatt.github.io/marp/">Marp</a>, Markdown to slide</li> |
||||
</ul></li> |
||||
</ul> |
||||
|
||||
<h3>預覽</h3> |
||||
|
||||
<ul> |
||||
<li>OSX |
||||
<ul> |
||||
<li><a href="https://itunes.apple.com/us/app/marked/id448925439">Marked</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
|
||||
<h3>通用文字編輯器</h3> |
||||
|
||||
<ul> |
||||
<li><a href="http://www.sublimetext.com/">Sublime Text</a></li> |
||||
<li>Vim |
||||
<ul> |
||||
<li><a href="https://github.com/plasticboy/vim-markdown">plasticboy/vim-markdown</a></li> |
||||
<li><a href="https://github.com/tpope/vim-markdown">tpope/vim-markdown</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
|
||||
<h3>網頁文字編輯器</h3> |
||||
|
||||
<ul> |
||||
<li><a href="http://ace.ajax.org/">Ace</a></li> |
||||
<li><a href="http://codemirror.net/">CodeMirror</a></li> |
||||
<li><a href="http://dillinger.io/">Dillinger</a></li> |
||||
<li><a href="http://oscargodson.github.io/EpicEditor/">EpicEditor</a></li> |
||||
<li><a href="https://github.com/bianchimro/markgiu">Markgiu</a></li> |
||||
</ul> |
||||
|
||||
<h3>瀏覽器 Extension</h3> |
||||
|
||||
<ul> |
||||
<li><a href="https://github.com/adam-p/markdown-here/">Markdown Here</a></li> |
||||
</ul> |
||||
|
||||
<h2>擴充版 Markdown</h2> |
||||
|
||||
<ul> |
||||
<li><a href="https://help.github.com/articles/github-flavored-markdown">GitHub Flavored Markdown</a> |
||||
<ul> |
||||
<li><a href="https://github.github.com/gfm/">Spec</a></li> |
||||
</ul></li> |
||||
<li><a href="http://kramdown.rubyforge.org/quickref.html#headers">kramdown</a></li> |
||||
<li><a href="http://fletcherpenney.net/multimarkdown/">MultiMarkdown</a></li> |
||||
<li><a href="http://johnmacfarlane.net/pandoc/README.html#pandocs-markdown">Pandoc's markdown</a> |
||||
<ul> |
||||
<li><a href="http://pages.tzengyuxio.me/pandoc/">Pandoc’s Markdown 語法中文翻譯</a></li> |
||||
</ul></li> |
||||
<li><a href="http://michelf.ca/projects/php-markdown/extra/">PHP Markdown Extra</a></li> |
||||
<li><a href="https://rmarkdown.rstudio.com/">R Markdown</a></li> |
||||
<li><a href="http://markua.com/">Maruka</a></li> |
||||
</ul> |
||||
|
||||
<h2>引擎</h2> |
||||
|
||||
<ul> |
||||
<li>C |
||||
<ul> |
||||
<li><a href="https://github.com/jgm/cmark">cmark</a></li> |
||||
<li><a href="https://github.com/vmg/sundown">Sundown</a> </li> |
||||
</ul></li> |
||||
<li>JavaScript |
||||
<ul> |
||||
<li><a href="https://github.com/jgm/commonmark.js">commonmark.js</a></li> |
||||
<li><a href="https://github.com/cky/wmd">showdown</a>, not maintained any more</li> |
||||
<li><a href="https://github.com/StackExchange/pagedown">pagedown</a>, StackOverflow</li> |
||||
<li><a href="https://github.com/coreyti/showdown">coreyti/showdown</a></li> |
||||
<li><a href="https://github.com/chjj/marked">marked</a></li> |
||||
<li><a href="https://jonschlinkert.github.io/remarkable/demo/">Remarkable</a></li> |
||||
</ul></li> |
||||
<li>PHP |
||||
<ul> |
||||
<li><a href="http://michelf.ca/projects/php-markdown/">PHP Markdown</a></li> |
||||
</ul></li> |
||||
<li>Python |
||||
<ul> |
||||
<li><a href="https://pypi.python.org/pypi/CommonMark">CommonMark</a></li> |
||||
</ul></li> |
||||
<li>Ruby |
||||
<ul> |
||||
<li><a href="https://github.com/vmg/redcarpet">Redcarpet</a> </li> |
||||
<li><a href="https://github.com/bhollis/maruku">Maruku</a></li> |
||||
</ul></li> |
||||
</ul> |
||||
|
||||
<h2>反向引擎</h2> |
||||
|
||||
<ul> |
||||
<li><a href="https://leeoniya.github.io/reMarked.js/">reMarked.js</a></li> |
||||
</ul> |
||||
|
||||
<h2>其它用途引擎</h2> |
||||
|
||||
<ul> |
||||
<li><a href="https://anydown.github.io/maildown/">maildown</a>, 轉為日本常用商業郵件格式</li> |
||||
<li><a href="https://conv.denshochan.com/tw/markdown">電電 Markdown</a>，擴充語法，轉為電子書，非開源</li> |
||||
<li><a href="https://github.com/mdx-js/mdx">mdx</a> Markdown in JSX</li> |
||||
<li><a href="https://github.com/jxnblk/mdx-deck">mdx-deck</a> MDX-based presentation decks</li> |
||||
<li><a href="https://github.com/jamesknelson/mdxc">mdxc</a> Convert markdown to React Component</li> |
||||
</ul> |
||||
|
||||
<h2>Blog 服務</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://wordpress.com/">WordPress.com</a></li> |
||||
<li><a href="http://logdown.com/">logdown</a></li> |
||||
</ul> |
||||
|
||||
<h2>Blog 系統</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://wordpress.org/">WordPress</a></li> |
||||
<li><a href="http://www.movabletype.org/">MOVABLETYPE</a></li> |
||||
</ul> |
||||
|
||||
<h2>其它服務</h2> |
||||
|
||||
<ul> |
||||
<li><a href="https://hackmd.io/">HackMD</a></li> |
||||
</ul> |
||||
|
||||
<h2>CSS</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://jasonm23.github.io/markdown-css-themes/">Markdown css themes</a></li> |
||||
<li><a href="http://mrcoles.com/demo/markdown-css/">Markdown.css</a></li> |
||||
</ul> |
||||
|
||||
<h2>其他工具</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://www.stack.nl/~dimitri/doxygen/manual/markdown.html">Doxygen</a></li> |
||||
</ul> |
||||
|
||||
<h2>標準</h2> |
||||
|
||||
<ul> |
||||
<li><a href="http://daringfireball.net/projects/markdown/">Markdown</a></li> |
||||
<li><a href="http://www.codinghorror.com/blog/2012/10/the-future-of-markdown.html">The Future of Markdown</a></li> |
||||
<li><a href="http://www.w3.org/community/markdown/">W3C Markdown Community Group</a></li> |
||||
<li><a href="http://www.w3.org/community/markdown/wiki/Main_Page">W3C Markdown Community Group wiki</a></li> |
||||
</ul> |
||||
|
||||
<h2>感謝</h2> |
||||
|
||||
<p>感謝 <a href="http://kidwm.net/">WM</a> 協助整理</p> |
||||
@ -1,80 +0,0 @@
@@ -1,80 +0,0 @@
|
||||
html, |
||||
html.han-biaodian-pro-cns { |
||||
/* font-family: "Biaodian Pro Sans CNS", "Helvetica Neue", Arial, "Han Heiti", sans-serif; */ |
||||
} |
||||
|
||||
body { |
||||
margin: 0; |
||||
padding: 0 1em; |
||||
} |
||||
|
||||
footer { |
||||
margin: 64px auto 0; |
||||
border-radius: 4px 4px 0 0; |
||||
border: 1px solid #e9e9e9; |
||||
max-width: 760px; |
||||
padding: 6px 10px; |
||||
font-size: 12px; |
||||
color: #666; |
||||
background: #f8f8f8; |
||||
} |
||||
|
||||
div.wikistyle ul li, |
||||
div.wikistyle ol li, |
||||
article.wikistyle ul li, |
||||
article.wikistyle ol li { |
||||
line-height: 1.2; |
||||
} |
||||
|
||||
nav, div.wikistyle, article.wikistyle, #comments{ |
||||
width: 760px; |
||||
margin: 0 auto; |
||||
} |
||||
div.wikistyle, article.wikistyle, #comments { |
||||
margin-top: 1em; |
||||
} |
||||
nav a { |
||||
margin-right: 0.5em; |
||||
} |
||||
nav, div.wikistyle, article.wikistyle, #comments{background-color:#f8f8f8;padding:.7em;} |
||||
nav, div.wikistyle, article.wikistyle, #comments{border:1px solid #e9e9e9;} |
||||
|
||||
.wikistyle h1,.wikistyle h2,.wikistyle h3,.wikistyle h4,.wikistyle h5,.wikistyle h6{border:0!important;} |
||||
.wikistyle h1{font-size:170%!important;border-top:4px solid #aaa!important;padding-top:.5em!important;margin-top:1.5em!important;} |
||||
.wikistyle h1:first-child{margin-top:0!important;padding-top:.25em!important;border-top:none!important;} |
||||
.wikistyle h2{font-size:150%!important;margin-top:1.5em!important;border-top:4px solid #e0e0e0!important;padding-top:.5em!important;} |
||||
.wikistyle h3{margin-top:1em!important;} |
||||
.wikistyle p{margin:1em 0!important;line-height:1.5em!important;} |
||||
.wikistyle a.absent{color:#a00;} |
||||
.wikistyle ul,#wiki-form .content-body ul{margin:1em 0 1em 0em!important;} |
||||
.wikistyle ol,#wiki-form .content-body ol{margin:1em 0 1em 0em!important;} |
||||
.wikistyle ul li,#wiki-form .content-body ul li,.wikistyle ol li,#wiki-form .content-body ol li{margin-top:.5em;margin-bottom:.5em;} |
||||
.wikistyle ul ul,.wikistyle ul ol,.wikistyle ol ol,.wikistyle ol ul,#wiki-form .content-body ul ul,#wiki-form .content-body ul ol,#wiki-form .content-body ol ol,#wiki-form .content-body ol ul{margin-top:0!important;margin-bottom:0!important;} |
||||
.wikistyle blockquote{margin:1em 0!important;border-left:5px solid #ddd!important;padding-left:.6em!important;color:#555!important;} |
||||
.wikistyle dt{font-weight:bold!important;margin-left:1em!important;} |
||||
.wikistyle dd{margin-left:2em!important;margin-bottom:1em!important;} |
||||
.wikistyle table{margin:1em 0!important;} |
||||
.wikistyle table th{border-bottom:1px solid #bbb!important;padding:.2em 1em!important;} |
||||
.wikistyle table td{border-bottom:1px solid #ddd!important;padding:.2em 1em!important;} |
||||
.wikistyle pre{margin:1em 0;font-size:12px;background-color:#eee;border:1px solid #ddd;padding:5px;line-height:1.5em;color:#444;overflow:auto;-webkit-box-shadow:rgba(0,0,0,0.07) 0 1px 2px inset;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} |
||||
.wikistyle pre::-webkit-scrollbar{height:8px;width:8px;} |
||||
.wikistyle pre::-webkit-scrollbar-track-piece{margin-bottom:10px;background-color:#e5e5e5;border-bottom-left-radius:4px 4px;border-bottom-right-radius:4px 4px;border-top-left-radius:4px 4px;border-top-right-radius:4px 4px;} |
||||
.wikistyle pre::-webkit-scrollbar-thumb:vertical{height:25px;background-color:#ccc;-webkit-border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(255,255,255,1);} |
||||
.wikistyle pre::-webkit-scrollbar-thumb:horizontal{width:25px;background-color:#ccc;-webkit-border-radius:4px;} |
||||
.wikistyle pre code{padding:0!important;font-size:12px!important;background-color:#eee!important;border:none!important;} |
||||
.wikistyle code{font-size:14px!important;background-color:#f8f8ff!important;color:#444!important;padding:0 .2em!important;border:1px solid #dedede!important;} |
||||
.wikistyle a code,.wikistyle a:link code,.wikistyle a:visited code{color:#4183c4!important;} |
||||
.wikistyle img{max-width:100%;} |
||||
.wikistyle pre.console{margin:1em 0!important;font-size:12px!important;background-color:black!important;padding:.5em!important;line-height:1.5em!important;color:white!important;} |
||||
.wikistyle pre.console code{padding:0!important;font-size:12px!important;background-color:black!important;border:none!important;color:white!important;} |
||||
.wikistyle pre.console span{color:#888!important;} |
||||
.wikistyle pre.console span.command{color:yellow!important;} |
||||
.wikistyle .frame{margin:0;display:inline-block;} |
||||
.wikistyle .frame img{display:block;} |
||||
.wikistyle .frame>span{display:block;border:1px solid #aaa;padding:4px;} |
||||
.wikistyle .frame span span{display:block;font-size:10pt;margin:0;padding:4px 0 2px 0;text-align:center;line-height:10pt;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;} |
||||
.wikistyle .float-left{float:left;padding:.5em 1em .25em 0;} |
||||
.wikistyle .float-right{float:right;padding:.5em 0 .25em 1em;} |
||||
.wikistyle .align-left{display:block;text-align:left;} |
||||
.wikistyle .align-center{display:block;text-align:center;} |
||||
.wikistyle .align-right{display:block;text-align:right;} |
||||
@ -0,0 +1,713 @@
@@ -0,0 +1,713 @@
|
||||
|
||||
|
||||
Markdown 文件 |
||||
================== |
||||
|
||||
 |
||||
|
||||
**NOTE:** 本文是简体中文意译,英文原文见 [Markdown: Syntax][eng-doc]. |
||||
|
||||
[eng-doc]:http://daringfireball.net/projects/markdown/syntax |
||||
|
||||
Markdown: 语法(syntax) |
||||
================ |
||||
|
||||
* [概述](#overview) |
||||
* [宗旨](#philosophy) |
||||
* [兼容 HTML](#html) |
||||
* [特殊字符自动转换](#autoescape) |
||||
* [区块元素](#block) |
||||
* [段落和换行](#p) |
||||
* [标题](#header) |
||||
* [区块引用](#blockquote) |
||||
* [列表](#list) |
||||
* [代码区块](#precode) |
||||
* [分隔线](#hr) |
||||
* [区段元素](#span) |
||||
* [链接](#link) |
||||
* [强调](#em) |
||||
* [代码](#code) |
||||
* [图片](#img) |
||||
* [其它](#misc) |
||||
* [自动链接](#autolink) |
||||
* [反斜杠](#backslash) |
||||
* [感谢](#acknowledgement) |
||||
|
||||
**注意：**这份文件是用 Markdown 写的，你可以[看看它的原始档][src] 。 |
||||
|
||||
[src]: https://github.com/osokay/markdown-syntax-zh/edit/master/syntax_zh.md |
||||
|
||||
* * * |
||||
|
||||
<h2 id="overview">概述</h2> |
||||
|
||||
<h3 id="philosophy">宗旨</h3> |
||||
|
||||
Markdown 的目标是实现「易读易写」。 |
||||
|
||||
可读性，无论如何，都是最重要的。一份使用 Markdown 格式撰写的文件应该可以直接以纯文本发布，并且看起来不会像是由许多标签或是格式指令所构成。Markdown 语法受到一些既有 text-to-HTML 格式的影响，包括 [Setext] [1]、[atx] [2]、[Textile] [3]、[reStructuredText] [4]、[Grutatext] [5] 和 [EtText] [6]，而最大灵感来源其实是纯文本电子邮件的格式。 |
||||
|
||||
总之， Markdown 的语法全由一些符号所组成，这些符号经过精挑细选，其作用一目了然。比如：在文字两旁加上星号，看起来就像*强调*。Markdown 的列表看起来，嗯，就是列表。Markdown 的区块引用看起来就真的像是引用一段文字，就像你曾在电子邮件中见过的那样。 |
||||
|
||||
[1]: http://docutils.sourceforge.net/mirror/setext.html |
||||
[2]: http://www.aaronsw.com/2002/atx/ |
||||
[3]: http://textism.com/tools/textile/ |
||||
[4]: http://docutils.sourceforge.net/rst.html |
||||
[5]: http://www.triptico.com/software/grutatxt.html |
||||
[6]: http://ettext.taint.org/doc/ |
||||
|
||||
<h3 id="html">兼容 HTML</h3> |
||||
|
||||
Markdown 的格式语法只涵盖纯文本可以涵盖的范围，不在 Markdown 涵盖范围之内的标签，都可以直接在文件里面用 HTML 撰写。不需要额外标注这是 HTML 或是 Markdown；只要直接加标签就可以了。 |
||||
|
||||
只有区块元素──比如 `<div>`、`<table>`、`<pre>`、`<p>` 等标签，必须在前后加上空行与其它内容区隔开，而且这些（元素）的开始与结尾标签，不可以用制表符或空格来缩进。Markdown 的生成器足够智能，不会在 HTML 区块标签外加上不必要的 `<p>` 标签。 |
||||
|
||||
举例来说，在 Markdown 文件里加上一段 HTML 表格： |
||||
|
||||
This is a regular paragraph. |
||||
|
||||
<table> |
||||
<tr> |
||||
<td>Foo</td> |
||||
</tr> |
||||
</table> |
||||
|
||||
This is another regular paragraph. |
||||
|
||||
Markdown 语法在 HTML 区块标签中将不会被进行处理。比如，你在 HTML 区块内使用 Markdown 样式的`*强调*`会没有效果。 |
||||
|
||||
HTML 的区段（行内）标签如 `<span>`、`<cite>`、`<del>` 则不受限制，可以在 Markdown 的段落、列表或是标题里任意使用。依照个人习惯，甚至可以不用Markdown 格式，而直接采用 HTML 标签来格式化。举例说明：如果比较喜欢 HTML 的 `<a>` 或 `<img>` 标签，可以直接使用这些标签，而不用 Markdown 提供的链接或是图像标签语法。 |
||||
|
||||
请注意，Markdown 语法在 HTML 区段标签间是有效的。 |
||||
|
||||
<h3 id="autoescape">特殊字符自动转换</h3> |
||||
|
||||
在 HTML 文件中，有两个字符需要特殊处理： `<` 和 `&` 。 `<` 符号用于起始标签，`&` 符号则用于标记 HTML 实体，如果你只是想要显示这些字符的原型，你必须要使用实体的形式，像是 `<` 和 `&`。 |
||||
|
||||
`&` 符号其实很容易让写作网络文件的人感到困扰，如果你要打「AT&T」 ，你必须要写成「`AT&T`」 ，而且网址中的 `&` 字符也要转换。如果你要链接到： |
||||
|
||||
http://images.google.com/images?num=30&q=larry+bird |
||||
|
||||
你必须要把网址写成： |
||||
|
||||
http://images.google.com/images?num=30&q=larry+bird |
||||
|
||||
才能放到链接标签的 `href` 属性里。不用说也知道这很容易忽略，这也可能是 HTML 标准检查所检查到的错误中，数量最多的。 |
||||
|
||||
Markdown 可以自动处理这些符号，如果你使用的 `&` 字符是 HTML 字符实体的一部分，它会保留原状，否则它会被转换成 `&`;。 |
||||
所以你如果要在文件中插入一个著作权的符号，你可以这样写： |
||||
|
||||
© |
||||
|
||||
Markdown 将不会对这段文字做修改，但是如果你这样写： |
||||
|
||||
AT&T |
||||
|
||||
Markdown 就会将它转为： |
||||
|
||||
AT&T |
||||
|
||||
类似的状况也会发生在 `<` 符号上，因为 Markdown 支持 [兼容 HTML](#html) ，如果你是使用 `<` 符号作为 HTML 标签使用，那 Markdown 也不会对它做任何转换，但是如果你是写： |
||||
|
||||
4 < 5 |
||||
|
||||
Markdown 将会把它转换为： |
||||
|
||||
4 < 5 |
||||
|
||||
不过需要注意的是，code 范围内，不论是行内还是区块， `<` 和 `&` 两个符号都**一定**会被转换成 HTML 实体，这项特性让你可以很容易地用 Markdown 写 HTML code （和 HTML 相对而言， HTML 语法中，你要把所有的 `<` 和 `&` 都转换为 HTML 实体，才能在 HTML 文件里面写出 HTML code。） |
||||
|
||||
* * * |
||||
|
||||
<h2 id="block">区块元素</h2> |
||||
|
||||
|
||||
<h3 id="p">段落和换行</h3> |
||||
|
||||
一个 Markdown 段落是由一个或多个连续的文本行组成，它的前后要有一个以上的空行（空行的定义是显示上看起来像是空的，便会被视为空行。比方说，若某一行只包含空格和制表符，则该行也会被视为空行）。普通段落不该用空格或制表符来缩进。 |
||||
|
||||
「由一个或多个连续的文本行组成」这句话其实暗示了 Markdown 允许段落内的强迫换行（插入换行符），这个特性和其他大部分的 text-to-HTML 格式不一样（包括 Movable Type 的「Convert Line Breaks」选项），其它的格式会把每个换行符都转成 `<br />` 标签。 |
||||
|
||||
如果你**真的**想要插入 `<br />` 标签的话，在行尾加上两个以上的格然后回车。 |
||||
|
||||
是的，这确实需要花比较多功夫来插入 `<br />` ，但是「每个换行都转换为 `<br />`」的方法在 Markdown 中并不适合， Markdown 中 email 式的 [区块引用][bq] 和多段落的 [列表][l] 在使用换行来排版的时候，不但更好用，还更好阅读。 |
||||
|
||||
[bq]: #blockquote |
||||
[l]: #list |
||||
|
||||
<h3 id="header">标题</h3> |
||||
|
||||
Markdown 支持两种标题的语法，类 [Setext] [1] 和类 [atx] [2] 形式。 |
||||
|
||||
类 Setext 形式是用底线的形式，利用 `=` （最高阶标题）和 `-` （第二阶标题），例如： |
||||
|
||||
This is an H1 |
||||
============= |
||||
|
||||
This is an H2 |
||||
------------- |
||||
|
||||
任何数量的 `=` 和 `-` 都可以有效果。 |
||||
|
||||
类 Atx 形式则是在行首插入 1 到 6 个 `#` ，对应到标题 1 到 6 阶，例如： |
||||
|
||||
# This is an H1 |
||||
|
||||
## This is an H2 |
||||
|
||||
###### This is an H6 |
||||
|
||||
你可以选择性地「闭合」类 atx 样式的标题，这纯粹只是美观用的，若是觉得这样看起来比较舒适，你就可以在行尾加上 `#`，而行尾的 `#` 数量也不用和开头一样（行首的井字数量决定标题的阶数）： |
||||
|
||||
# This is an H1 # |
||||
|
||||
## This is an H2 ## |
||||
|
||||
### This is an H3 ###### |
||||
|
||||
|
||||
<h3 id="blockquote">Blockquotes</h3> |
||||
|
||||
Markdown 标记区块引用是使用类似 email 中用 `>` 的引用方式。如果你还熟悉在 email 信件中的引言部分，你就知道怎么在 Markdown 文件中建立一个区块引用，那会看起来像是你自己先断好行，然后在每行的最前面加上 `>` ： |
||||
|
||||
> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, |
||||
> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. |
||||
> Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. |
||||
> |
||||
> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse |
||||
> id sem consectetuer libero luctus adipiscing. |
||||
|
||||
Markdown 也允许你只在整个段落的第一行最前面加上 `>` ： |
||||
|
||||
> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet, |
||||
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus. |
||||
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. |
||||
|
||||
> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse |
||||
id sem consectetuer libero luctus adipiscing. |
||||
|
||||
区块引用可以有嵌套（例如：引用内的引用），只要根据层数加上不同数量的 `>` ： |
||||
|
||||
> This is the first level of quoting. |
||||
> |
||||
> > This is nested blockquote. |
||||
> |
||||
> Back to the first level. |
||||
|
||||
引用的区块内也可以使用其他的 Markdown 语法，包括标题、列表、代码区块等： |
||||
|
||||
> ## This is a header. |
||||
> |
||||
> 1. This is the first list item. |
||||
> 2. This is the second list item. |
||||
> |
||||
> Here's some example code: |
||||
> |
||||
> return shell_exec("echo $input | $markdown_script"); |
||||
|
||||
任何标准的文本编辑器都能简单地建立 email 样式的引用，例如 BBEdit ，你可以选取文字后然后从选单中选择*增加引用阶层*。 |
||||
|
||||
<h3 id="list">列表</h3> |
||||
|
||||
Markdown 支持有序列表和无序列表。 |
||||
|
||||
无序清单使用星号、加号或是减号作为列表标记： |
||||
|
||||
* Red |
||||
* Green |
||||
* Blue |
||||
|
||||
等同于： |
||||
|
||||
+ Red |
||||
+ Green |
||||
+ Blue |
||||
|
||||
也等同于： |
||||
|
||||
- Red |
||||
- Green |
||||
- Blue |
||||
|
||||
有序列表则使用数字接着一个英文句点： |
||||
|
||||
1. Bird |
||||
2. McHale |
||||
3. Parish |
||||
|
||||
很重要的一点是，你在列表标记上使用的数字并不会影响输出的 HTML 结果，上面的列表所产生的 HTML 标记为： |
||||
|
||||
<ol> |
||||
<li>Bird</li> |
||||
<li>McHale</li> |
||||
<li>Parish</li> |
||||
</ol> |
||||
|
||||
如果你的列表标记写成： |
||||
|
||||
1. Bird |
||||
1. McHale |
||||
1. Parish |
||||
|
||||
或甚至是： |
||||
|
||||
3. Bird |
||||
1. McHale |
||||
8. Parish |
||||
|
||||
你都会得到完全相同的 HTML 输出。重点在于，你可以让 Markdown 文件的列表数字和输出的结果相同，或是你懒一点，你可以完全不用在意数字的正确性。 |
||||
|
||||
如果你使用懒惰的写法，建议第一个项目最好还是从 1. 开始，因为 Markdown 未来可能会支持有序列表的 start 属性。 |
||||
|
||||
列表项目标记通常是放在最左边，但是其实也可以缩进，最多 3 个空格，项目标记后面则一定要接着至少一个空格或制表符。 |
||||
|
||||
要让列表看起来更漂亮，你可以把内容用固定的缩进整理好： |
||||
|
||||
* Lorem ipsum dolor sit amet, consectetuer adipiscing elit. |
||||
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, |
||||
viverra nec, fringilla in, laoreet vitae, risus. |
||||
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit. |
||||
Suspendisse id sem consectetuer libero luctus adipiscing. |
||||
|
||||
但是如果你很懒，那也行： |
||||
|
||||
* Lorem ipsum dolor sit amet, consectetuer adipiscing elit. |
||||
Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi, |
||||
viverra nec, fringilla in, laoreet vitae, risus. |
||||
* Donec sit amet nisl. Aliquam semper ipsum sit amet velit. |
||||
Suspendisse id sem consectetuer libero luctus adipiscing. |
||||
|
||||
如果列表项目间用空行分开， 在输出 HTML 时 Markdown 会把项目的内容在输出时用 `<p>` |
||||
标签包起来，举例来说： |
||||
|
||||
* Bird |
||||
* Magic |
||||
|
||||
会被转换为： |
||||
|
||||
<ul> |
||||
<li>Bird</li> |
||||
<li>Magic</li> |
||||
</ul> |
||||
|
||||
但是这个： |
||||
|
||||
* Bird |
||||
|
||||
* Magic |
||||
|
||||
会被转换为： |
||||
|
||||
<ul> |
||||
<li><p>Bird</p></li> |
||||
<li><p>Magic</p></li> |
||||
</ul> |
||||
|
||||
列表项目可以包含多个段落，每个项目下的段落都必须缩进 4 个空格或是 1 个制表符： |
||||
|
||||
1. This is a list item with two paragraphs. Lorem ipsum dolor |
||||
sit amet, consectetuer adipiscing elit. Aliquam hendrerit |
||||
mi posuere lectus. |
||||
|
||||
Vestibulum enim wisi, viverra nec, fringilla in, laoreet |
||||
vitae, risus. Donec sit amet nisl. Aliquam semper ipsum |
||||
sit amet velit. |
||||
|
||||
2. Suspendisse id sem consectetuer libero luctus adipiscing. |
||||
|
||||
如果你每行都有缩进，看起来会看好很多，当然，Markdown 也允许： |
||||
|
||||
* This is a list item with two paragraphs. |
||||
|
||||
This is the second paragraph in the list item. You're |
||||
only required to indent the first line. Lorem ipsum dolor |
||||
sit amet, consectetuer adipiscing elit. |
||||
|
||||
* Another item in the same list. |
||||
|
||||
如果要在列表项目内放进引用，那 `>` 就需要缩进： |
||||
|
||||
* A list item with a blockquote: |
||||
|
||||
> This is a blockquote |
||||
> inside a list item. |
||||
|
||||
如果要放代码区块的话，该区块就需要缩排**两次**，也就是 8 个空格或是 2 个制表符： |
||||
|
||||
* A list item with a code block: |
||||
|
||||
<code goes here> |
||||
|
||||
|
||||
当然，项目列表很可能会不小心产生，像是下面这样的写法： |
||||
|
||||
1986. What a great season. |
||||
|
||||
换句话说，也就是在行首出现**数字-句点-空白**，要避免这样的状况，你可以在句点前面加上反斜杠。 |
||||
|
||||
1986\. What a great season. |
||||
|
||||
<h3 id="precode">程序代码区块</h3> |
||||
|
||||
和程序相关的写作或是标签语言原始码通常会有已经排版好的代码区块，通常这些区块我们并不希望它以一般段落文件的方式去排版，而是照原来的样子显示，Markdown 会用 `<pre>` 和 `<code>` 标签来把代码区块包起来。 |
||||
|
||||
要在 Markdown 中建立代码区块很简单，只要简单地缩进 4 个空格或是 1 个制表符就可以，例如，下面的输入： |
||||
|
||||
This is a normal paragraph: |
||||
|
||||
This is a code block. |
||||
|
||||
Markdown 会转换成： |
||||
|
||||
<p>This is a normal paragraph:</p> |
||||
|
||||
<pre><code>This is a code block. |
||||
</code></pre> |
||||
|
||||
这个每行一阶的缩进（4 个空格或是 1 个制表符），都会被移除，例如： |
||||
|
||||
Here is an example of AppleScript: |
||||
|
||||
tell application "Foo" |
||||
beep |
||||
end tell |
||||
|
||||
会被转换为： |
||||
|
||||
<p>Here is an example of AppleScript:</p> |
||||
|
||||
<pre><code>tell application "Foo" |
||||
beep |
||||
end tell |
||||
</code></pre> |
||||
|
||||
一个代码区块会一直持续到没有缩进的那一行（或是文件结尾）。 |
||||
|
||||
在代码区块里面， `&` 、 `<` 和 `>` 会自动转成 HTML 实体，这样的方式让你非常容易使用 Markdown 插入范例用的 HTML 原始码，只需要复制贴上，再加上缩进就可以了，剩下的 Markdown 都会帮你处理，例如： |
||||
|
||||
<div class="footer"> |
||||
© 2004 Foo Corporation |
||||
</div> |
||||
|
||||
会被转换为： |
||||
|
||||
<pre><code><div class="footer"> |
||||
&copy; 2004 Foo Corporation |
||||
</div> |
||||
</code></pre> |
||||
|
||||
代码区块中，一般的 Markdown 语法不会被转换，像是星号便只是星号，这表示你可以很容易地以 Markdown 语法撰写 Markdown 语法相关的文件。 |
||||
|
||||
<h3 id="hr">分隔线</h3> |
||||
|
||||
你可以在一行中用三个或以上的星号、减号来建立一个分隔线，行内不能有其他东西。你也可以在星号中间插入空格。下面每种写法都可以建立分隔线： |
||||
|
||||
* * * |
||||
|
||||
*** |
||||
|
||||
***** |
||||
|
||||
- - - |
||||
|
||||
--------------------------------------- |
||||
|
||||
|
||||
* * * |
||||
|
||||
<h2 id="span">区段元素</h2> |
||||
|
||||
<h3 id="link">链接</h3> |
||||
|
||||
Markdown 支持两种形式的链接语法： **行内式**和**参考式**两种形式。 |
||||
|
||||
不管是哪一种，链接的文字都是用 [方括号] 来标记。 |
||||
|
||||
要建立一个**行内式**的链接，只要在方括号后面马上接着圆括号并插入网址链接即可，如果你还想要加上链接的 title 文字，只要在网址后面，用双引号把 title 文字包起来即可，例如： |
||||
|
||||
This is [an example](http://example.com/ "Title") inline link. |
||||
|
||||
[This link](http://example.net/) has no title attribute. |
||||
|
||||
会产生： |
||||
|
||||
<p>This is <a href="http://example.com/" title="Title"> |
||||
an example</a> inline link.</p> |
||||
|
||||
<p><a href="http://example.net/">This link</a> has no |
||||
title attribute.</p> |
||||
|
||||
如果你是要链接到同样主机的资源，你可以使用相对路径： |
||||
|
||||
See my [About](/about/) page for details. |
||||
|
||||
**参考式**的链接是在链接文字的括号后面再接上另一个方括号，而在第二个方括号里面要填入用以辨识链接的标记： |
||||
|
||||
This is [an example][id] reference-style link. |
||||
|
||||
你也可以选择性地在两个方括号中间加上空格： |
||||
|
||||
This is [an example] [id] reference-style link. |
||||
|
||||
接着，在文件的任意处，你可以把这个标签的链接内容定义出来： |
||||
|
||||
[id]: http://example.com/ "Optional Title Here" |
||||
|
||||
链接内容定义的形式为： |
||||
|
||||
* 方括号（前面可以选择性地加上至多三个空格来缩进），里面输入链接文字 |
||||
* 接着一个冒号 |
||||
* 接着一个以上的空格或制表符 |
||||
* 接着链接的网址 |
||||
* 选择性地接着 title 内容，可以用单引号、双引号或是圆括号包着 |
||||
|
||||
下面这三种连结的定义都是相同： |
||||
|
||||
[foo]: http://example.com/ "Optional Title Here" |
||||
[foo]: http://example.com/ 'Optional Title Here' |
||||
[foo]: http://example.com/ (Optional Title Here) |
||||
|
||||
**请注意：**有一个已知的问题是 Markdown.pl 1.0.1 会忽略单引号包起来的链接 title。 |
||||
|
||||
链接网址也可以用方括号包起来： |
||||
|
||||
[id]: <http://example.com/> "Optional Title Here" |
||||
|
||||
你也可以把 title 属性放到下一行，也可以加一些缩进，网址太长的话，这样会比较好看： |
||||
|
||||
[id]: http://example.com/longish/path/to/resource/here |
||||
"Optional Title Here" |
||||
|
||||
网址定义只有在产生链接的时候用到，并不会直接出现在文件之中。 |
||||
|
||||
链接辨识标记可以有字母、数字、空白和标点符号，但是并**不区分**大小写，因此下面两个链接是一样的： |
||||
|
||||
[link text][a] |
||||
[link text][A] |
||||
|
||||
**隐式链接标记**功能让你可以省略指定链接标记，这种情形下，链接标记和链接文字会视为相同，要用隐式链接标记只要在链接文字后面加上一个空的方括号，如果你要让 "Google" 链接到 google.com，你可以简化成： |
||||
|
||||
[Google][] |
||||
|
||||
然后定义链接内容： |
||||
|
||||
[Google]: http://google.com/ |
||||
|
||||
由于链接文字可能包含空白，所以这种简化的标记内也可以包含多个单词： |
||||
|
||||
Visit [Daring Fireball][] for more information. |
||||
|
||||
然后接着定义链接： |
||||
|
||||
[Daring Fireball]: http://daringfireball.net/ |
||||
|
||||
链接的定义可以放在文件中的任何一个地方，我比较偏好直接放在链接出现段落的后面，你也可以把它放在文件最后面，就像是注解一样。 |
||||
|
||||
下面是一个参考式链接的范例： |
||||
|
||||
I get 10 times more traffic from [Google] [1] than from |
||||
[Yahoo] [2] or [MSN] [3]. |
||||
|
||||
[1]: http://google.com/ "Google" |
||||
[2]: http://search.yahoo.com/ "Yahoo Search" |
||||
[3]: http://search.msn.com/ "MSN Search" |
||||
|
||||
如果改成用链接名称的方式写： |
||||
|
||||
I get 10 times more traffic from [Google][] than from |
||||
[Yahoo][] or [MSN][]. |
||||
|
||||
[google]: http://google.com/ "Google" |
||||
[yahoo]: http://search.yahoo.com/ "Yahoo Search" |
||||
[msn]: http://search.msn.com/ "MSN Search" |
||||
|
||||
上面两种写法都会产生下面的 HTML。 |
||||
|
||||
<p>I get 10 times more traffic from <a href="http://google.com/" |
||||
title="Google">Google</a> than from |
||||
<a href="http://search.yahoo.com/" title="Yahoo Search">Yahoo</a> |
||||
or <a href="http://search.msn.com/" title="MSN Search">MSN</a>.</p> |
||||
|
||||
下面是用行内形式写的同样一段内容的 Markdown 文件，提供作为比较之用： |
||||
|
||||
I get 10 times more traffic from [Google](http://google.com/ "Google") |
||||
than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or |
||||
[MSN](http://search.msn.com/ "MSN Search"). |
||||
|
||||
参考式的链接其实重点不在于它比较好写，而是它比较好读，比较一下上面的范例，使用参考式的文章本身只有 81 个字符，但是用行内形式的连结却会增加到 176 个字符，如果是用纯 HTML 格式来写，会有 234 个字符，在 HTML 格式中，标签比文字还要多。 |
||||
|
||||
使用 Markdown 的参考式链接，可以让文件更像是浏览器最后产生的结果，让你可以把一些标记相关的信息移到段落文字之外，你就可以增加连结而不让文章的阅读感觉被打断。 |
||||
|
||||
<h3 id="em">强调</h3> |
||||
|
||||
Markdown 使用星号（`*`）和底线（`_`）作为标记强调字词的符号，被 `*` 或 `_` 包围的字词会被转成用 `<em>` 标签包围，用两个 `*` 或 `_` 包起来的话，则会被转成 `<strong>`，例如： |
||||
|
||||
*single asterisks* |
||||
|
||||
_single underscores_ |
||||
|
||||
**double asterisks** |
||||
|
||||
__double underscores__ |
||||
|
||||
会转成： |
||||
|
||||
<em>single asterisks</em> |
||||
|
||||
<em>single underscores</em> |
||||
|
||||
<strong>double asterisks</strong> |
||||
|
||||
<strong>double underscores</strong> |
||||
|
||||
你可以随便用你喜欢的样式，唯一的限制是，你用什么符号开启标签，就要用什么符号结束。 |
||||
|
||||
强调也可以直接插在文字中间： |
||||
|
||||
un*frigging*believable |
||||
|
||||
但是**如果你的 `*` 和 `_` 两边都有空白的话，它们就只会被当成普通的符号**。 |
||||
|
||||
如果要在文字前后直接插入普通的星号或底线，你可以用反斜杠： |
||||
|
||||
\*this text is surrounded by literal asterisks\* |
||||
|
||||
<h3 id="code">代码</h3> |
||||
|
||||
如果要标记一小段行内代码，你可以用反引号把它包起来（`` ` ``），例如： |
||||
|
||||
Use the `printf()` function. |
||||
|
||||
会产生： |
||||
|
||||
<p>Use the <code>printf()</code> function.</p> |
||||
|
||||
如果要在代码区段内插入反引号，你可以用多个反引号来开启和结束代码区段： |
||||
|
||||
``There is a literal backtick (`) here.`` |
||||
|
||||
这段语法会产生： |
||||
|
||||
<p><code>There is a literal backtick (`) here.</code></p> |
||||
|
||||
代码区段的起始和结束端都可以放入一个空白，起始端后面一个，结束端前面一个，这样你就可以在区段的一开始就插入反引号： |
||||
|
||||
A single backtick in a code span: `` ` `` |
||||
|
||||
A backtick-delimited string in a code span: `` `foo` `` |
||||
|
||||
会产生： |
||||
|
||||
<p>A single backtick in a code span: <code>`</code></p> |
||||
|
||||
<p>A backtick-delimited string in a code span: <code>`foo`</code></p> |
||||
|
||||
在代码区段内，`&` 和方括号都会被转成 HTML 实体，这样会比较容易插入 HTML 原始码，Markdown 会把下面这段： |
||||
|
||||
Please don't use any `<blink>` tags. |
||||
|
||||
转为： |
||||
|
||||
<p>Please don't use any <code><blink></code> tags.</p> |
||||
|
||||
你也可以这样写： |
||||
|
||||
`—` is the decimal-encoded equivalent of `—`. |
||||
|
||||
以产生： |
||||
|
||||
<p><code>&#8212;</code> is the decimal-encoded |
||||
equivalent of <code>&mdash;</code>.</p> |
||||
|
||||
|
||||
|
||||
<h3 id="img">图片</h3> |
||||
|
||||
很明显地，要在纯文本应用中设计一个 「自然」的语法来插入图片是有一定难度的。 |
||||
|
||||
Markdown 使用一种和链接很相似的语法来标记图片，同样也允许两种样式： **行内式**和**参考式**。 |
||||
|
||||
行内式图片的语法看起来像是： |
||||
|
||||
 |
||||
|
||||
 |
||||
|
||||
详细叙述如下： |
||||
|
||||
* 一个惊叹号 `!` |
||||
* 接着一对方括号，里面放上图片的替代文字 |
||||
* 接着一对普通括号，里面放上图片的网址，最后还可以用引号包住并加上选择性的 'title' 文字。 |
||||
|
||||
参考式的图片语法则长得像这样： |
||||
|
||||
![Alt text][id] |
||||
|
||||
「id」是图片参考的名称，图片参考的定义方式则和链接参考一样： |
||||
|
||||
[id]: url/to/image "Optional title attribute" |
||||
|
||||
到目前为止， Markdown 还没有办法指定图片的宽高，如果你需要的话，你可以使用普通的 `<img>` 标签。 |
||||
|
||||
* * * |
||||
|
||||
<h2 id="misc">其它</h2> |
||||
|
||||
<h3 id="autolink">自动链接</h3> |
||||
|
||||
Markdown 支持比较简短的自动连结形式来处理网址和电子邮件信箱，只要是用方括号包起来， Markdown 就会自动把它转成链接，链接的文字就和链接位置一样，例如： |
||||
|
||||
<http://example.com/> |
||||
|
||||
Markdown 会转为： |
||||
|
||||
<a href="http://example.com/">http://example.com/</a> |
||||
|
||||
邮址的自动链接也很类似，只是 Markdown 会先做一个编码转换的过程，把文字字符转成 16 进位码的 HTML 实体，这样的格式可以糊弄一些不好的邮址收集机器人，例如： |
||||
|
||||
<address@example.com> |
||||
|
||||
Markdown 会转成： |
||||
|
||||
<a href="mailto:addre |
||||
ss@example.co |
||||
m">address@exa |
||||
mple.com</a> |
||||
|
||||
在浏览器里面，这段字符串（其实是 `<a href="mailto:address@example.com">address@example.com</a>`）会变成一个可以点击的「address@example.com」链接。 |
||||
|
||||
（这种作法虽然可以糊弄不少的机器人，但并无法全部挡下来，不过这样也比什么都不做好些。无论如何，公开你的信箱终究会引来广告信件的。） |
||||
|
||||
<h3 id="backslash">反斜杠</h3> |
||||
|
||||
Markdown 可以利用反斜杠来插入一些在语法中有其它意义的符号，例如：如果你想要用星号加在文字旁边的方式来做出强调效果（但不用 `<em>` 标签），你可以在星号的前面加上反斜杠： |
||||
|
||||
\*literal asterisks\* |
||||
|
||||
Markdown 支持在下面这些符号前面加上反斜杠来帮助插入普通的符号： |
||||
|
||||
\ 反斜杠 |
||||
` 反引号 |
||||
* 星号 |
||||
_ 底线 |
||||
{} 大括号 |
||||
[] 方括号 |
||||
() 括号 |
||||
# 井字号 |
||||
+ 加号 |
||||
- 减号 |
||||
. 英文句点 |
||||
! 惊叹号 |
||||
|
||||
<h2 id="acknowledgement">感谢</h2> |
||||
|
||||
感谢 [leafy7382][] 协助翻译，[hlb][]、[Randylien][] 帮忙润稿，[ethantw][] 的[汉字标准格式・CSS Reset][]， [WM][] 回报文字错误。 |
||||
因 gitcafe 被coding 收购, 原来[markdown中文][]翻译消失, 我们迁移到了github上 |
||||
|
||||
[leafy7382]:https://twitter.com/#!/leafy7382 |
||||
[hlb]:http://iamhlb.com/ |
||||
[Randylien]:http://twitter.com/randylien |
||||
[ethantw]:https://twitter.com/#!/ethantw |
||||
[汉字标准格式・CSS Reset]:http://ethantw.net/projects/han/ |
||||
[WM]:http://kidwm.net/ |
||||
[markdown中文]: http://wowubuntu.com/markdown/ |
||||
@ -1,83 +0,0 @@
@@ -1,83 +0,0 @@
|
||||
<!DOCTYPE html> |
||||
<html lang="zh-TW" class="han-biaodian-pro-cns han-la"> |
||||
<head> |
||||
<meta charset="UTF-8" /> |
||||
<title>Markdown 語法說明</title> |
||||
<link |
||||
rel="stylesheet" |
||||
media="all" |
||||
href="//cdnjs.cloudflare.com/ajax/libs/Han/3.2.2/han.min.css" |
||||
/> |
||||
<link rel="stylesheet" media="all" href="stylesheets/main.css" /> |
||||
<meta property="og:title" content="Markdown 語法說明" /> |
||||
<meta property="og:url" content="https://markdown.tw/" /> |
||||
<meta property="og:type" content="website" /> |
||||
<meta |
||||
property="og:description" |
||||
content="Markdown 是很簡單的純文件格式，由於語法設計得好，近幾年廣泛應用在各種領域，包括 Github、Stack Overflow 等知名的網路服務都使用它，本網頁為該語法的中文說明" |
||||
/> |
||||
<meta |
||||
property="og:image" |
||||
content="https://markdown.tw/images/208x128.png" |
||||
/> |
||||
<meta property="og:image:width" content="208" /> |
||||
<meta property="og:image:height" content="128" /> |
||||
</head> |
||||
<body |
||||
class="tk-source-han-sans-traditional" |
||||
style="font-family: -apple-system;" |
||||
> |
||||
<nav> |
||||
<a href="/">文件</a> |
||||
<a href="/resources.html">資源</a> |
||||
<a href="http://commonmark.org/" |
||||
>標準<img |
||||
src="external-link-alt-solid.svg" |
||||
width="12" |
||||
height="12" |
||||
alt="" |
||||
style="margin: 1px 0 -1px 3px;" |
||||
/></a> |
||||
<a href="https://github.com/othree/markdown-syntax-zhtw/issues" |
||||
>回報錯誤<img |
||||
src="external-link-alt-solid.svg" |
||||
width="12" |
||||
height="12" |
||||
alt="" |
||||
style="margin: 1px 0 -1px 3px;" |
||||
/></a> |
||||
</nav> |
||||
|
||||
<div class="wikistyle"> |
||||
{{ CONTENT }} |
||||
</div> |
||||
|
||||
<footer>Made with <3 by <a href="https://othree.net">othree</a>.</footer> |
||||
|
||||
<script type="text/javascript"> |
||||
var _gaq = _gaq || []; |
||||
_gaq.push(["_setAccount", "UA-21880461-1"]); |
||||
_gaq.push(["_trackPageview"]); |
||||
|
||||
(function () { |
||||
var ga = document.createElement("script"); |
||||
ga.type = "text/javascript"; |
||||
ga.async = true; |
||||
ga.src = |
||||
("https:" == document.location.protocol |
||||
? "https://ssl" |
||||
: "http://www") + ".google-analytics.com/ga.js"; |
||||
var s = document.getElementsByTagName("script")[0]; |
||||
s.parentNode.insertBefore(ga, s); |
||||
})(); |
||||
</script> |
||||
|
||||
<script src="https://use.typekit.net/gib3xul.js"></script> |
||||
<script> |
||||
try { |
||||
Typekit.load(); |
||||
} catch (e) {} |
||||
</script> |
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Han/3.2.2/han.min.js"></script> |
||||
</body> |
||||
</html> |
||||
Loading…
Reference in new issue