HTML基础(四):语义化标签&字符实体
HTML标签的语义化
所谓的标签语义化,就是指标签的含义。语义化让页面有良好的结构与含义,从而让人和机器能快速理解网页内容。
- 作用:
- 方便代码的阅读和维护
- 同时让浏览器或是网络爬虫可以很好地解析,从而更好分析其中的内容
- 使用语义化标签会具有更好地搜索引擎优化
- 容易兼容不同设备
- 核心:合适的地方给一个最为合理的标签。
- 语义是否良好: 当我们去掉CSS之后,网页结构依然组织有序,并且有良好的可读性。一眼看去,就知道那个是重点,结构是什么,知道每块的内容是干啥的。
- 遵循的原则:先确定语义的HTML ,再选合适的CSS。
没有语义的布局标签-div&span
实际开发网页时会大量频繁的使用到div和span这两个没有语义的布局标签
- div标签:一行只显示一个(独占一行)
- span标签:一行可以显示多个
- 代码
<div>这是div标签</div>
<span>这是span标签</span>
有语义的布局标签
- 标签:
标签名 | 语义 |
---|---|
header | 网页头部 |
nav | 网页导航 |
footer | 网页底部 |
aside | 网页侧边栏 |
section | 网页区块 |
article | 网页文章 |
- em strong标签
- dl dt dd标签
- 注意点:
- 以上标签显示特点和div一致,但比div多了不同语义
字符实体
- 场景:在网页中展示特殊符号效果时,需要使用字符实体代替
- 结构:&英文;
- 常见字符实体:
https://m.runoob.com/html/html-entities.html - 代码
实体字符学习,空 格
本文来自博客园,作者:是小鱼呀,转载请注明原文链接:https://www.cnblogs.com/sophia12138/p/16623564.html