-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
411 lines (275 loc) · 14.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
<!DOCTYPE html>
<html lang="zh-Hans">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=2">
<meta name="theme-color" content="#222">
<meta name="generator" content="Hexo 4.2.1">
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon-next.png">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32-next.png">
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16-next.png">
<link rel="mask-icon" href="/images/logo.svg" color="#222">
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/lib/font-awesome/css/all.min.css">
<link rel="stylesheet" href="/lib/animate-css/animate.min.css">
<script class="hexo-configurations">
var NexT = window.NexT || {};
var CONFIG = {"hostname":"yoursite.com","root":"/","scheme":"Muse","version":"8.0.0-rc.4","exturl":false,"sidebar":{"position":"left","display":"post","padding":18,"offset":12},"copycode":false,"bookmark":{"enable":false,"color":"#222","save":"auto"},"fancybox":false,"mediumzoom":false,"lazyload":false,"pangu":false,"comments":{"style":"tabs","active":null,"storage":true,"lazyload":false,"nav":null},"algolia":{"hits":{"per_page":10},"labels":{"input_placeholder":"Search for Posts","hits_empty":"We didn't find any results for the search: ${query}","hits_stats":"${hits} results found in ${time} ms"}},"localsearch":{"enable":false,"trigger":"auto","top_n_per_article":1,"unescape":false,"preload":false},"motion":{"enable":true,"async":false,"transition":{"post_block":"fadeIn","post_header":"fadeInDown","post_body":"fadeInDown","coll_header":"fadeInLeft","sidebar":"fadeInUp"}}};
</script>
<meta property="og:type" content="website">
<meta property="og:title" content="Yhoo's Blog">
<meta property="og:url" content="http://yoursite.com/index.html">
<meta property="og:site_name" content="Yhoo's Blog">
<meta property="article:author" content="Yuhao Liu">
<meta name="twitter:card" content="summary">
<link rel="canonical" href="http://yoursite.com/">
<script class="page-configurations">
// https://hexo.io/docs/variables.html
CONFIG.page = {
sidebar: "",
isHome : true,
isPost : false,
lang : 'zh-Hans'
};
</script>
<title>Yhoo's Blog</title>
<noscript>
<style>
body { margin-top: 2rem; }
.use-motion .menu-item,
.use-motion .sidebar,
.use-motion .post-block,
.use-motion .pagination,
.use-motion .comments,
.use-motion .post-header,
.use-motion .post-body,
.use-motion .collection-header {
visibility: visible;
}
.use-motion .header,
.use-motion .site-brand-container .toggle,
.use-motion .footer { opacity: initial; }
.use-motion .site-title,
.use-motion .site-subtitle,
.use-motion .custom-logo-image {
opacity: initial;
top: initial;
}
.use-motion .logo-line {
transform: scaleX(1);
}
.search-pop-overlay, .sidebar-nav { display: none; }
.sidebar-panel { display: block; }
</style>
</noscript>
</head>
<body itemscope itemtype="http://schema.org/WebPage">
<div class="container use-motion">
<div class="headband"></div>
<main class="main">
<header class="header" itemscope itemtype="http://schema.org/WPHeader">
<div class="header-inner"><div class="site-brand-container">
<div class="site-nav-toggle">
<div class="toggle" aria-label="Toggle navigation bar">
</div>
</div>
<div class="site-meta">
<a href="/" class="brand" rel="start">
<i class="logo-line"></i>
<h1 class="site-title">Yhoo's Blog</h1>
<i class="logo-line"></i>
</a>
</div>
<div class="site-nav-right">
<div class="toggle popup-trigger">
</div>
</div>
</div>
</div>
<div class="toggle sidebar-toggle">
<span class="toggle-line toggle-line-first"></span>
<span class="toggle-line toggle-line-middle"></span>
<span class="toggle-line toggle-line-last"></span>
</div>
<aside class="sidebar">
<div class="sidebar-inner sidebar-overview-active">
<ul class="sidebar-nav">
<li class="sidebar-nav-toc">
Table of Contents
</li>
<li class="sidebar-nav-overview">
Overview
</li>
</ul>
<!--noindex-->
<section class="post-toc-wrap sidebar-panel">
</section>
<!--/noindex-->
<section class="site-overview-wrap sidebar-panel">
<div class="site-author animated" itemprop="author" itemscope itemtype="http://schema.org/Person">
<p class="site-author-name" itemprop="name">Yuhao Liu</p>
<div class="site-description" itemprop="description"></div>
</div>
<div class="site-state-wrap animated">
<nav class="site-state">
<div class="site-state-item site-state-posts">
<a href="/archives">
<span class="site-state-item-count">1</span>
<span class="site-state-item-name">posts</span>
</a>
</div>
</nav>
</div>
</section>
</div>
</aside>
<div id="sidebar-dimmer"></div>
</header>
<div class="back-to-top">
<i class="fa fa-arrow-up"></i>
<span>0%</span>
</div>
<noscript>
<div id="noscript-warning">Theme NexT works best with JavaScript enabled</div>
</noscript>
<div class="main-inner">
<div class="content index posts-expand">
<article itemscope itemtype="http://schema.org/Article" class="post-block" lang="zh-Hans">
<link itemprop="mainEntityOfPage" href="http://yoursite.com/2020/07/14/Markdown%E6%9C%80%E5%9F%BA%E6%9C%AC%E8%AF%AD%E6%B3%95/">
<span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
<meta itemprop="image" content="/images/avatar.gif">
<meta itemprop="name" content="Yuhao Liu">
<meta itemprop="description" content="">
</span>
<span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
<meta itemprop="name" content="Yhoo's Blog">
</span>
<header class="post-header">
<h2 class="post-title" itemprop="name headline">
<a href="/2020/07/14/Markdown%E6%9C%80%E5%9F%BA%E6%9C%AC%E8%AF%AD%E6%B3%95/" class="post-title-link" itemprop="url">Markdown实用语法（撰写一篇文章的最基本语法）</a>
</h2>
<div class="post-meta">
<span class="post-meta-item">
<span class="post-meta-item-icon">
<i class="far fa-calendar"></i>
</span>
<span class="post-meta-item-text">Posted on</span>
<time title="Created: 2020-07-14 10:38:41 / Modified: 12:00:34" itemprop="dateCreated datePublished" datetime="2020-07-14T10:38:41+08:00">2020-07-14</time>
</span>
</div>
</header>
<div class="post-body" itemprop="articleBody">
<p>这是我的第一篇博文。未来我将会在atom工具上使用markdown语法来撰写博文了，还是非常激动滴。对于一个markdown初学者来说，没有必要学习各种列表、文档目录的复杂功能，只需要一些最基本的功能就好了。但是我在网上搜索博文时，都是一些冗长的文章，看得头大。<br>因此下面整理的内容，都是完成一篇博文所需要的最最基本语法，帮助我快速写好一篇文章，而一些暂时不重要的细节操作，就统统删去了～本文参考了<a href="https://blog.csdn.net/sun8112133/article/details/79871702?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase" target="_blank" rel="noopener">这篇基础操作文章</a>和<a href="https://www.jianshu.com/p/280c6a6f2594" target="_blank" rel="noopener">这篇关于插入图片的文章</a></p>
<h2 id="基本语法"><a href="#基本语法" class="headerlink" title="基本语法"></a>基本语法</h2><table>
<thead>
<tr>
<th align="left">项目</th>
<th align="right">价格</th>
</tr>
</thead>
<tbody><tr>
<td align="left">段内换行</td>
<td align="right">句末连续2个空格+1个Enter</td>
</tr>
<tr>
<td align="left">段内空格</td>
<td align="right">Enter或空格</td>
</tr>
<tr>
<td align="left">分段</td>
<td align="right">连续2个Enter</td>
</tr>
</tbody></table>
<p>提示：上述三个语法是写文章过程中最常用的操作，一定要烂熟于心。和word有一些区别，所以需要一点时间来适应。</p>
<h2 id="文字格式"><a href="#文字格式" class="headerlink" title="文字格式"></a>文字格式</h2><p><strong>粗体</strong> <code>**要加粗的文字**</code><br><em>斜体</em> <code>*要倾斜的文字*</code><br><strong><em>粗斜体</em></strong> <code>***要粗斜的文字***</code><br><del>删除体</del> <code>~~要删除的文字~~</code> </p>
<p>提示：输入时不要加空格</p>
<h2 id="引用"><a href="#引用" class="headerlink" title="引用"></a>引用</h2><p>引用也是非常常用的操作，可以把引用的内容从正文中剥离出来，方便阅读。</p>
<blockquote>
<p>知识就是力量 ——弗朗西斯培根</p>
</blockquote>
<h2 id="代码段"><a href="#代码段" class="headerlink" title="代码段"></a>代码段</h2><h3 id="1）代码句"><a href="#1）代码句" class="headerlink" title="1）代码句"></a>1）代码句</h3><p>英文的反引号 中夹着代码</p>
<h3 id="2）代码段"><a href="#2）代码段" class="headerlink" title="2）代码段"></a>2）代码段</h3><p>点击四个空格，后面即可输入代码段</p>
<h3 id="3）代码段-方法2"><a href="#3）代码段-方法2" class="headerlink" title="3）代码段-方法2"></a>3）代码段-方法2</h3><p>在开始和结束处输入三个反引号</p>
<h2 id="表格"><a href="#表格" class="headerlink" title="表格"></a>表格</h2><p>我在上文介绍<strong>基本语法</strong>时就使用了表格语法，具体格式如下： </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">| 项目 | 价格 | 数量 |</span><br><span class="line">| :-------- | --------:| :--: |</span><br><span class="line">| Computer | 1600 元 | 5 |</span><br><span class="line">| Phone | 12 元 | 12 |</span><br><span class="line">| Pipe | 1 元 | 234 |</span><br></pre></td></tr></table></figure>
<p>注：第二行<code>:</code>的作用是确定<code>:</code>以下内容的对齐方式，<br><code>:---</code>代表向左对齐<br><code>---:</code>代表向右对齐<br><code>:--:</code>代笔居中对齐</p>
<p>问题：如何更改表头的对齐格式？</p>
<table>
<thead>
<tr>
<th align="left">项目</th>
<th align="right">价格</th>
<th align="center">数量</th>
</tr>
</thead>
<tbody><tr>
<td align="left">Computer</td>
<td align="right">1600 元</td>
<td align="center">5</td>
</tr>
<tr>
<td align="left">Phone</td>
<td align="right">12 元</td>
<td align="center">12</td>
</tr>
<tr>
<td align="left">Pipe</td>
<td align="right">1 元</td>
<td align="center">234</td>
</tr>
</tbody></table>
<h2 id="插入或引用图片"><a href="#插入或引用图片" class="headerlink" title="插入或引用图片"></a>插入或引用图片</h2><p>插入图片有很多方法，这里只介绍最方便、最常用的！<br><code></code> </p>
<p>输入上述代码后，即可显示👇的图片。 </p>
<p>其中，<code>[figure title]</code>是图片的标签，可以填写任意文字，随自己开心就好，也可以空着不写，<strong>但是<code>[]</code>必须要写，不能省略。</strong><br><code>"optional text"</code>是鼠标悬置于图片上会出现的标题文字，可以不写.<br><img src="https://cdn.pixabay.com/photo/2020/03/09/16/02/silk-4916174_1280.jpg" alt="" title="option text"></p>
<h2 id="插入或引用链接"><a href="#插入或引用链接" class="headerlink" title="插入或引用链接"></a>插入或引用链接</h2><p><code>[苹果官网](http://www.apple.com/cn/ "苹果中国")</code><br>输入上述代码，即可得到右边的这个段内链接，非常方便，可以点这个<a href="http://www.apple.com/cn/" target="_blank" rel="noopener" title="苹果中国">苹果官网</a>链接。</p>
</div>
<footer class="post-footer">
<div class="post-eof"></div>
</footer>
</article>
</div>
<script>
window.addEventListener('tabs:register', () => {
let { activeClass } = CONFIG.comments;
if (CONFIG.comments.storage) {
activeClass = localStorage.getItem('comments_active') || activeClass;
}
if (activeClass) {
let activeTab = document.querySelector(`a[href="#comment-${activeClass}"]`);
if (activeTab) {
activeTab.click();
}
}
});
if (CONFIG.comments.storage) {
window.addEventListener('tabs:click', event => {
if (!event.target.matches('.tabs-comment .tab-content .tab-pane')) return;
let commentClass = event.target.classList[1];
localStorage.setItem('comments_active', commentClass);
});
}
</script>
</div>
</main>
<footer class="footer">
<div class="footer-inner">
<div class="copyright">
©
<span itemprop="copyrightYear">2020</span>
<span class="with-love">
<i class="fa fa-heart"></i>
</span>
<span class="author" itemprop="copyrightHolder">Yuhao Liu</span>
</div>
<div class="powered-by">Powered by <a href="https://hexo.io/" class="theme-link" rel="noopener" target="_blank">Hexo</a> & <a href="https://theme-next.js.org/muse/" class="theme-link" rel="noopener" target="_blank">NexT.Muse</a>
</div>
</div>
</footer>
</div>
<script src="/lib/anime.min.js"></script>
<script src="/js/utils.js"></script>
<script src="/js/motion.js"></script>
<script src="/js/schemes/muse.js"></script>
<script src="/js/next-boot.js"></script>
</body>
</html>