2019_11_26学习记录

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中的全局概念