Markdown is a way to style text on the web. And it also supports HTML code.

Turn off background music

Headings

To create a heading, add one to six # symbols before your heading text. The number of # you use will determine the size of the heading.

0
1
2
3
4
5
# The largest heading
## The second largest heading
### The third largest heading
#### The fourth largest heading
##### The fifth largest heading
###### The smallest heading

The largest heading

The second largest heading

The third largest heading

The fourth largest heading

The fifth largest heading

The smallest heading

Styling text

Indicate emphasis with bold, italic, or strikethrough text.

0
1
2
3
4
5
6
7
8
**Bold** or __Bold__
*Italic* or _Italic_  
<!--Line break: double spaces at the end of the line, or a <br>-->
**Bold and nested _italic_**<br>
***All bold and italic ***  
~~Strikethrough~~  
<u>Underline</u>
<font color="#FFCC00">Yellow#FFCC00</font>
<!--Make a comment here-->

Bold or Bold Italic or Italic
Bold and nested italic
**All bold and italic **
Strikethrough
Underline

Paragraphs

You can create a new paragraph by leaving a blank line between lines of text.

Quoting

Text

You can quote text with a >.

0
1
2
3
4
>苟利国家生死以，岂因祸福避趋之
—— 林则徐

>@Tracer Reply to @Lúcio: Hi!
>>@Lúcio: Hello!

苟利国家生死以，岂因祸福避趋之 —— 林则徐

@Tracer Reply to @Lúcio: Hi!

@Lúcio: Hello!

Code

Use a Tab to show a code block.

Call out code or a command within a sentence with single backticks.

The text within the backticks will not be formatted.

0
Use `git status` to list all new or modified files that haven't yet been committed.

Use git status to list all new or modified files that haven’t yet been committed.

Syntax highlighted code block

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
To format code or text into its own distinct block, use triple backticks.
```c
# include <stdio.h>
int main(){
    printf("Hello_world!\n);
    return 0;
}
```
```csharp
using System;
namespace HelloWorldApplication
{
    class HelloWorld
    {
        static void Main(string[] args)
        {
            Console.WriteLine("Hello World");
            Console.ReadKey();
        }
    }
}
```

0
1
2
3
4
# include <stdio.h>
int main(){
    printf("Hello_world!\n);
    return 0;
}

0
1
2
3
4
5
6
7
8
9
10
11
using System;
namespace HelloWorldApplication
{
   class HelloWorld
   {
      static void Main(string[] args)
      {
         Console.WriteLine("Hello World");
         Console.ReadKey();
      }
   }
}

Language keys for markdown code highlight are at the end of the page.

Links

Create an inline link by wrapping link text in brackets [ ], and then wrapping the URL in parentheses ( ). You can also use the keyboard shortcut Ctrl/command + k to create a link.

0
1
2
3
4
5
6
7
8
9
10
11
This site was built by [lzzmm](https://github.com/lzzmm/lzzmm.github.io).  
<a herf = "./index">炸毛的秘密基地</a>  
Here are links to [Archive][1] and [About][2].  
Here is a link to [Home].  
<!--Must have at less one line above the links-->

[1]: https://lzzmm.github.io/archive/   "Archive"  
[2]: https://lzzmm.github.io/about/     "About"  
[Home]: https://lzzmm.github.io/

<https://github.com/lzzmm/lzzmm.github.io>  
<cleveryh@qq.com>  

This site was built by lzzmm.
炸毛的秘密基地
Here are links to Archive and About.
Here is a link to Home.

https://github.com/lzzmm/lzzmm.github.io
cleveryh@qq.com

Images

0
![CleverYh](/img/CleverYh.png)

0
<img src="/img/CleverYh.png" width="256" height="168">

Why it doesn’t work on GitHub Pages?

Lists

Make an unordered list by preceding one or more lines of text with -, + or *.

Unordered

0
1
2
3
- Orange  
- Watermelon  
* Bird
+ Elephant

• Orange
• Watermelon
• Bird
• Elephant

Ordered

0
1
2
1. Junkrat
2. Hanzo
3. Torbjörn

1. Junkrat
2. Hanzo
3. Torbjörn

Nested

0
1
2
3
4
5
6
7
8
9
10
11
- Mathematic
    1. Mathematical Analysis
    2. Advanced Algebra
    3. Discrete Mathematics
    4. ...
- Programming
    + Objected-Oriented Programming
        1. C++
        2. Java
        3. ...
    + Procedure-Oriented Programming
        - ...

• Mathematic
  1. Mathematical Analysis
  2. Advanced Algebra
  3. Discrete Mathematics
  4. …
• Programming
  • Objected-Oriented Programming
    1. C++
    2. Java
    3. …
  • Procedure-Oriented Programming
    • …

Task lists

To create a task list, preface list items with a regular space character followed by [ ]. To mark a task as complete, use [x].
If a task list item description begins with a parenthesis, you’ll need to escape it with \.

0
1
2
- [x] Finish my changes
- [ ] Push my commits to GitHub
- [ ] \(...)Open a pull request

• Finish my changes
• Push my commits to GitHub
• (…)Open a pull request

Tables

0
1
2
3
4
| Fruits     | Price   | Weight  |
| :------:   | :-----  | -----:  |
| Banana     | $7      |   5     |
| Orange     | $5      |   6     |
| Apple      | $3      |   7     |

Something about HTML

0
1
2
3
<font color="#FF4500">我要变成这个颜色#FF4500</font> 
<font size="1">我要变成1号字</font> 
<font size="6">我要变成6号字</font>
<table><tr><td bgcolor="#6495ED">我要变成#6495ED背景色</td></tr></table>

css_colornames

0
1
2
3
<details>
  <summary>**展开查看源码**</summary>
  展开的内容及代码块
</details>

Live2D

Deploy Live2D on web page

Inserting songs

Inserting songs from NetEase Music

网易云音乐提供单曲、专辑、歌单、电台节目的外链播放器，将外链播放器放在论坛、网站上，都可以免费播放。

如何使用外链播放器？

1. 在网页版（music.163.com）进入单曲、歌单、专辑、电台节目页面后，点击 “生成外链播放器” 链接。
2. 歌单和专辑外链播放器可以选择大中小三种尺寸，单曲和电台节目可以选择中小两种尺寸。你可以选择最适合你网站设计的尺寸。
3. 还可以选择是否要自动播放，打上勾后，别人访问网站时播放器会自动开始播放。
4. 最后将播放器的代码黏贴到你的网站上，大功告成！

0
1
2
3
4
<iframe frameborder="0" border="1" 
            marginwidth="0" marginheight="0"
            width="100%" height="256" 
            src="//music.163.com/outchain/player?type=2&amp;id=19169096&amp;auto=1&amp;height=80">
    </iframe>

Inserting videos

0
1
2
<video src="" controls="controls" width="100%" height="auto"/>

<iframe src="" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

Inserting videos from bilibili

1. Mouse hover on the Share button below the video you want on bilibili.com.
2. You will see “将视频贴到博客或论坛” /*啊啊啊啊啊英语太难写了*/， 然后复制嵌入代码，插入到网页中。这时就可以看到视频显示在页面上。
3. 但是，此时在我这个GitHub Page 上显示的视频十分的小，而且点不到全屏按钮。这是因为 bilibili的iframe播放器是没有等比适应的!

于是我们帮他适配。首先定义一个CSS类↓

0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
.aspect-ratio {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 75%;
}

.aspect-ratio iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

在aspect-ratio类中，宽度被设为100%，高度被设为0，padding-bottom属性（外部下边距）被设为75%。因为 当padding-bottom的值为百分比时，百分比计算的基准为父元素的宽，而aspect-ratio类的宽度为父元素宽度的100%，所以它的外部下边距也就占宽度的75%。这样，aspect-ratio类的实际宽高比（包含边距的宽高比）就变为了四比三。另外，aspect-ration类的position必须定义为relative，保证它的定位是相对于原始位置定义。
在aspect-ratio类下的iframe元素宽高都被设为100%。因为 当元素的position属性设为absolute且width和height属性的值为百分比时，百分比计算基准分别为父元素包含外边距的宽和高。所以，此时iframe元素会占满整个aspect-ratio类的父元素，形成四比三的宽高比。 回到Markdown或HTML页面，用一个aspect-ratio类的块内容把iframe包起来↓

0
1
2
<div class="aspect-ratio">
    <iframe src="//player.bilibili.com/player.html?aid=291063543&bvid=BV1Nf4y1874b&cid=350593644&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
</div>

成功!

这种方法对于其它的iframe框架也管用⊙﹏⊙∥

Extras

Mathematical formulas (GitHub Pages with Mathjax enabled)

0
1
2
3
4
5
6
7
8
9
10
11
12
$$
\begin{aligned}
    A = \{ \langle G \rangle \vert G \text{ is a connected undirected graph}\}
\end{aligned}
$$
// above works in markdown editor but can't be resolved by MathJax.

$A = \{\langle G \rangle \vert G \text{ is a connected undirected graph}\}$

$c=\sqrt{a^{2}+b_{xy}^{2}+e^{x}}$

$\lim_{n \rightarrow \infty}\sin x_{n}=0$  
$\displaystyle\lim_{n \to \infty}\frac{2n^2+1}{n^2+n-2}=2$

$A = {\langle G \rangle \vert G \text{ is a connected undirected graph}}$

$c=\sqrt{a^{2}+b_{xy}^{2}+e^{x}}$

$\lim_{n \rightarrow \infty}\sin x_{n}=0$
$\displaystyle\lim_{n \to \infty}\frac{2n^2+1}{n^2+n-2}=2$

LATEX Mathematical Symbols

Using emoji (GitHub Flavored Markdown)

You can add emoji to your writing by typing :EMOJICODE:.

0
That's cool! :thumbsup:

That’s cool! :thumbsup: :+1:

Viewable on GitHub and Typora but error on this page.

emoji database

https://www.webfx.com/tools/emoji-cheat-sheet/

移步评论区

Language key (maybe fragmentary)

END

If there’s any question, please comment! Thank you!

• Previous
  Change Log
• Next
  旺柴：一种最新型的微信交流语言