-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
280 lines (168 loc) · 8.82 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
<!DOCTYPE html>
<html lang="zh-Hans">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Irelia的博客 </title>
<meta name="viewport" content="width=device-width,minimum-scale=1">
<meta name="generator" content="Hugo 0.58.3" />
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
<link href="/dist/css/app.d98f2eb6bcd1eaedb7edf166bd16af26.css" rel="stylesheet">
<link href="/index.xml" rel="alternate" type="application/rss+xml" title="Irelia的博客" />
<link href="/index.xml" rel="feed" type="application/rss+xml" title="Irelia的博客" />
<meta property="og:title" content="Irelia的博客" />
<meta property="og:description" content="" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://mambaneverout.github.io/" />
<meta property="og:updated_time" content="2020-04-08T21:50:32+08:00" />
<meta itemprop="name" content="Irelia的博客">
<meta itemprop="description" content="">
<meta name="twitter:card" content="summary"/>
<meta name="twitter:title" content="Irelia的博客"/>
<meta name="twitter:description" content=""/>
</head>
<body class="ma0 avenir bg-near-white">
<header>
<div class="pb3-m pb6-l bg-black">
<nav class="pv3 ph3 ph4-ns" role="navigation">
<div class="flex-l justify-between items-center center">
<a href="https://mambaneverout.github.io/" class="f3 fw2 hover-white no-underline white-90 dib">
Irelia的博客
</a>
<div class="flex-l items-center">
</div>
</div>
</nav>
<div class="tc-l pv3 ph3 ph4-ns">
<h1 class="f2 f-subheadline-l fw2 light-silver mb0 lh-title">
Irelia的博客
</h1>
</div>
</div>
</header>
<main class="pb7" role="main">
<article class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray">
</article>
<div class="pa3 pa4-ns w-100 w-70-ns center">
<h1 class="flex-none">
Recent Posts
</h1>
<section class="w-100 mw8">
<div class="relative w-100 mb4">
<article class="bb b--black-10">
<div class="db pv4 ph3 ph0-l no-underline dark-gray">
<div class="flex flex-column flex-row-ns">
<div class="blah w-100">
<h1 class="f3 fw1 athelas mt0 lh-title">
<a href="/post/%E9%9D%A2%E8%AF%95%E6%8A%BC%E9%A2%98/" class="color-inherit dim link">
面试押题
</a>
</h1>
<div class="f6 f5-l lh-copy nested-copy-line-height nested-links">
HTML 必考：你是如何理解 HTML 语义化的？
举例法：
HTML 语义化就是使用正确的标签（总结）段落就写 p 标签，标题就写 h1 标签，文章就写 article 标签，视频就写 video 标签，等等。
阐述法：
首先讲以前的后台开发人员使用 table 布局，然后讲美工人员使用 div+css 布局，最后讲专业的前端会使用正确的标签进行页面开发。
meta viewport 是做什么用的，怎么写？
举例法，然后逐个解释每个单词的意思。 initial-scale 定义设备宽度与视口大小之间的缩放比率。 maximum-scale 定义缩放的最大值 minimum-scale 定义缩放的最小值 user-scalable 如果设置为 no，用户将不能放大或缩小网页。默认值为 yes。
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1" /> 你用过哪些 HTML 5 标签？
举例法
平时如果只用 div 写页面你就完了，把你平时用到的 html5 标签列举出来即可，但是要注意如果这个标签的用法比较复杂，你要先看一下 MDN 的文档再说这个标签；如果你说出一个标签，却不知道它有哪些 API，那么你就会被扣分
内容相关：header、main、footer、article
功能相关：canvas、video、audio（处理后续问题）
H5 是什么？
</div>
<a href="/post/%E9%9D%A2%E8%AF%95%E6%8A%BC%E9%A2%98/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
</div>
</div>
</div>
</article>
</div>
<div class="relative w-100 mb4">
<article class="bb b--black-10">
<div class="db pv4 ph3 ph0-l no-underline dark-gray">
<div class="flex flex-column flex-row-ns">
<div class="blah w-100">
<h1 class="f3 fw1 athelas mt0 lh-title">
<a href="/post/node.jsnpmyarncommonjs%E8%A7%84%E8%8C%83/" class="color-inherit dim link">
Node
</a>
</h1>
<div class="f6 f5-l lh-copy nested-copy-line-height nested-links">
Node.js 计算密集型 ⼤量的计算，消耗 CPU 资源，⽐如计算圆周 率、对视频进⾏⾼清解码 C 语⾔ IO 密集型
⽹络、磁盘读写 Node.js 使用内置模块 fs
const fs = require("fs"); fs.readFile("./test.txt", "utf-8", function(err, str) { console.log(str); str = str.toUpperCase(); fs.writeFile("./test-after.txt", str, function(err) { console.log("操作完成"); }); }); http.createServer
const http = require("http"); http.createServer((req, res) => { res.end("hello world"); }).listen(8080); 使用本地模块
const util = require("./util"); let result = util.fact(5); console.log(result); function fact(n) { if (n === 1) return 1; return n * fact(n - 1); } module.
</div>
<a href="/post/node.jsnpmyarncommonjs%E8%A7%84%E8%8C%83/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
</div>
</div>
</div>
</article>
</div>
<div class="relative w-100 mb4">
<article class="bb b--black-10">
<div class="db pv4 ph3 ph0-l no-underline dark-gray">
<div class="flex flex-column flex-row-ns">
<div class="blah w-100">
<h1 class="f3 fw1 athelas mt0 lh-title">
<a href="/post/promise%E5%92%8Casyncawait/" class="color-inherit dim link">
Promise和async、await
</a>
</h1>
<div class="f6 f5-l lh-copy nested-copy-line-height nested-links">
Promise Promise 是一个类 Promise.all()
返回一个 Promise 实例， 所有 promise 都成功才会成功，有一个 promise 失败则为失败。
Promise.all([promise1, promise2,promise3).then(function(values) { console.log(values); }); Promise.race()
返回一个 promise，一旦 Promise 中的某个 promise 解决或拒绝，返回的 promise 就会解决或拒绝。
const promise1 = new Promise(function(resolve, reject) { setTimeout(resolve, 500, 'one'); }); const promise2 = new Promise(function(resolve, reject) { setTimeout(resolve, 100, 'two'); }); Promise.race([promise1, promise2]).then(function(value) { console.log(value); }); Promise.reject
返回一个带有拒绝原因的 Promise 对象
function resolved(result) { console.
</div>
<a href="/post/promise%E5%92%8Casyncawait/" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">read more</a>
</div>
</div>
</div>
</article>
</div>
</section>
<section class="w-100">
<h1 class="f3">More</h1>
<h2 class="f5 fw4 mb4 dib mr3">
<a href="/post/mockjs/" class="link black dim">
Mockjs
</a>
</h2>
<h2 class="f5 fw4 mb4 dib mr3">
<a href="/post/vue%E5%8A%A8%E7%94%BB/" class="link black dim">
Vue动画
</a>
</h2>
<h2 class="f5 fw4 mb4 dib mr3">
<a href="/post/react-hooks%E7%9A%84api/" class="link black dim">
React Hooks的API
</a>
</h2>
<h2 class="f5 fw4 mb4 dib mr3">
<a href="/post/%E6%8E%A2%E7%B4%A2react-hooks%E5%8E%9F%E7%90%86/" class="link black dim">
探索React Hooks原理
</a>
</h2>
<a href="/post/" class="link db f6 pa2 br3 bg-mid-gray white dim w4 tc">All Posts</a>
</section>
</div>
</main>
<footer class="bg-black bottom-0 w-100 pa3" role="contentinfo">
<div class="flex justify-between">
<a class="f4 fw4 hover-white no-underline white-70 dn dib-ns pv2 ph3" href="https://mambaneverout.github.io/" >
© 2020 Irelia的博客
</a>
<div>
</div>
</div>
</footer>
<script src="/dist/js/app.3fc0f988d21662902933.js"></script>
</body>
</html>