20191126
语义化(超重点)
什么是语义化
1.元素有着自己本身的意思,是什么元素就代表了什么意思
2.元素本身的含义与其表现样式无关,元素样式的表现是由CSS决定的
之所以其可以显示一定的样式,完全是因为浏览器自带有默认样式
为什么要语义化
1.为了搜索引擎优化(OEM)
搜索引擎抓取页面是抓取的源代码而不是文本
他搜索的内容会放到自己的数据库之中
语义化可以使得搜索引擎在抓取你的页面时可以更加的高效
而且,如果你语义化做的好,搜索结果更加的清晰明了,浏览器会将你的网页链接地址放置于最显眼的位置
2.让浏览器理解网页
阅读模式,语音模式
这些模式之中有些需要显示而有些不需要,所以又是浏览器会忽略一些元素
文本元素
HTML5中支持的元素
h head
一级到六级标题(h1->h6)
<!-- h1*6加上Tab -->
<!-- h1*6>{一级标题} -->
<!-- h1*6>{$} -->
<!-- $在使用时会自增 -->
h1元素一定比h2大吗??
那当然不会,元素显示样式与其是什么元素没有任何关系
p paragraphs
段落元素
<!-- p*3 -->
<!-- lorem emmet中的物品,会生成乱序假文 -->
<!-- p*6>lorem 这是用法 -->
span 无语义
CSS代码必须加到元素里,所以这个东西是用来设置样式的
而且这个元素不换行
某系元素在显示是会独占一行(块级元素),但某些不会(行级元素)
现在html5已经弃用这换种说法,最高处出现在4.01,可以叫块级元素为流内容类别,而行级元素叫措辞类别
使用display:block;可以将行变块
pre
预格式化文本元素(本质上也是无语义元素,但是官方说这不是无语义元素)
空白折叠:在源码之中的连续空白字符(空格,换行,tab)
这些空白元素在显示时会被折叠成为一个空格
这是CSS中的全局规则
好处是可以将代码中的缩进或者格式改变不会影响到页面上
而在pre中的所有内容会原样子的显示到网页上
pre功能本质是:自己含有默认的CSS样式
实体字符(字符编码)
HTML中的全局概念