This time I will bring you some little knowledge about html5 that is easily overlooked. What are the little things about html5 that are easily overlooked? The following is a practical case. Let’s take a look.
Set webstorm to wrap the input content after it exceeds the screen
##
dividing line
line wrap
2 .base tag: specifically used to uniformly specify how all
hyperlinks(a tags) in the current web page need to be opened
Note: The base tag must be written between the start tag and the end tag of the head tag
3. Fake connection: it will not jump after clicking, we call it a fake link!
1) <a href="#">百度一下,你就知道</a> #的假链接会自动回到网页的顶部
2) <a href="javascript">百度一下,你就知道</a> 而Javascript的假链接不会自动跳转到网页顶部
Copy after login
The difference between the two: #’s fake link will automatically return to the top of the web page, while Javascript’s fake link will not automatically jump to the top of the web page.
4. Anchor point:
If you want to jump to the specified location through the a tag, you must tell the a tag a unique ID number, so that the a tag can find the target location to jump to in the current interface.
1). Add an id attribute to the label of the target location, and then specify a unique value;
2). Tell the a label that the unique province certificate number corresponding to the target label you need to jump to is How much.
a tag href="#center"
Set id="center"
3). Jump to the specified position in the new interface href="13-anchor.html#bottom" target="_blank"Open in the new interface
In the original interface
Jump to the specified position in the new interfaceWrite this in the target interface< h1 id="bottom">I am the anchor test interface 333333
5. List tag:
Unordered list>>> Application scenario : a). News list b). Product list c). Navigation bar
Shortcut:
ul>li*3<ul>
<li>北京</li>
<li>上海</li>
<li>广州</li></ul>
Copy after login
Ordered list >>> Application scenario: Ranking
<ol>
<li>演员</li>
<li>小丑</li>
<li>龙卷风</li>
<li>青花瓷</li></ol>
Copy after login
Definition list>>> Application scenarios: a) . Create relevant information at the end of the website b) . Mix images and text
dt dd can also nest other tags
Shortcut: dl>(dt+dd)*2
<dt>北京</dt> //definition title 定义标题 <dd>中国的首都</dd> //definition description 定义描述 <dt>上海</dt>
<dd>富人的集中地</dd></dl>
Copy after login
6. Table label<!--默认情况下,边框宽度为0--><table border="1">
<!--tr:代表整个表格中的一行数据-->
<tr>
<!--td:代表一行中的一个单元格-->
<td>姓名</td>
<td>年龄</td>
<td>籍贯</td>
</tr>
<tr>
<td>张三</td>
<td>18</td>
<td>重庆</td>
</tr></table>
Copy after login
Thin line table< !--Thin-line table: It is unreliable to realize a thin-line table by specifying margin as 0 on the table. In fact, it merges two lines into one line,so It looks very uncomfortable, so set it in the following ways-->