最近更新: 2015-10-18

test css

摘要 excerpt. markdown 語法與部落格 CSS 展示。

Markdown.

分離 <--more-->

title 2

Markdown中一些特定的字符會被解析為格式化命令,但如果添加一個反斜槓(‘\‘)在那些有特殊意義的字符前面,那麼字符將被理解為字面意義。舉個例子,字符組合’\*‘會作為一個星號輸出,而不是理解為一個強調區段的開始。

Markdown provides backslash escapes for the following characters:

  • \ backslash
  • ` backtick
  • * asterisk
  • _ underscore
  • {} curly braces
  • [] square brackets
  • () parentheses
  • # hash mark
  • + plus sign
  • - minus sign (hyphen)
  • . dot
  • ! exclamation mark

如果想強迫換行,可以在行尾插入至少兩個空格。

The only restrictions are that block-level HTML elements — e.g. <div>, <table>, <pre>, <p>, etc. — must be separated from surrounding content by blank lines, and the start and end tags of the block should not be indented with tabs or spaces. Markdown is smart enough not to add extra (unwanted) <p> tags around HTML block-level tags.

Span-level HTML tags — e.g. <span>, <cite>, or <del> — can be used anywhere in a Markdown paragraph.

title 3

header

  • h1 # text
  • h2 ## text
  • h3 ### text
  • h4 #### text
  • h5 ##### text
  • h6 ###### text

Or underlined using equal signs. Any number of underlining =’s or -’s will work.

this is an H1
=============

this is an H2
-------

要產生水平分割線,可以在單獨一行輸入3個或以上的短橫線、星號或者底線。短橫線和星號之間可以輸入任意空格。

title 4

ul list. *, +, or -.

  • em. *emphasis*, _emphasis_ or wrapped with <em> tag.
  • dfn. wrapped with <dfn> tag. (為了方便輸入,我的 CSS 將 em 視同 dfn)
  • strong. **strong**, __strong__ or wrapped with <strong> tag.
  • $var. wrapped with <var> tag.
  • kbd. wrapped with <kbd> tag.
  • code. `inline code` or wrapped with <code> tag.
  • del. wrapped with <del> tag.
  • inline quote. wrapped with <q> tag.

ol list. started using any number like 1., 2..

  1. cite, book or title name. wrapped with <cite> tag.
  2. span .person, person name. wrapped with <span class=”person”> tag.

It looks nice if you indent every line of the subsequent paragraphs, but here again, Markdown will allow you to be lazy:

*   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.

*   Another item in the same list.

To put a code block within a list item, the code block needs to be indented twice — 8 spaces or two tabs:

*   A list item with a code block:

        ` code goes here `
title 5

link and image.

link CSS external link link, internal link, internal link link.

This is [an example](http://example.com/ “Title”) inline link. [This link](http://example.net/) has no title attribute. Or wrapped with <a> tag.

In Jekylle, using

{% post_url post_file_name %}

to get link.

Markdown supports a shortcut style for creating “automatic” links for URLs and email addresses: simply surround the URL or email address with angle brackets.

Reference-style links use a second set of square brackets, inside which you place a label of your choosing to identify the link:

This is [an example][id] reference-style link.

Then, anywhere in the document, you define your link label like this, on a line by itself:

[id]: http://example.com/ “Optional Title Here”

This is ![image title](imageurl). Or wrapped with <img> tag.

image 1:

image title

image 2:

small image

title 6

code blocks and highlight.

{% highlight lexer linenos=table %}
code
{% endhighlight %}
1
2
3
4
5
6
7
8
9
10
11
<?php
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
echo "Hello $name\n";
?>

highitlight no linenos

<?php
echo "Hello $name\n";
?>

This is online code. `inline code` or wrapped with <code> tag.

simple code block wrapped with ```. append lexer name in the first ```:

```lexer
code
```

lexer text for plain text. CSS:

```text
plain text
```
plain text
  plain text
   plain text

lexer term for terminal, console window. CSS:

$ ls
$ ps ax |grep abc > cc

Raw data

{% raw %}
Raw data. Also escape cub characters
test css
{% endraw %}

blockquote

Markdown uses email-style > characters for blockquoting. It looks best if you hard wrap the text and put a > before every line.

Blockquotes can be nested (i.e. a blockquote-in-a-blockquote) by adding additional levels of >.

> blockquote
> <cite>cite</cite>

CSS:

blockquote1
blockquote2

para2 cite

This is short quote, wrapped with <q> tag.

Note div. wrapped with <div class=”note”> tag. CSS:

div class note.

text. text. text. text. text. text. text. text. text. inline note (span class=note) inline note. 中文。 中文(側註)。 中文。 text. text. text. text. text. text. text. text. text. 中文。 中文。 中文。