网络直播|web前端入门教程(非常详细)( 二 )

性能差，使用 resst.css 文件，会把使用到和使用不到的样式文件都加载进来，出现代码冗余，所以被一起企业已经抛弃了。
normalize 与 reset.css 一样，是一个样式的重置库。主要是为了增强跨浏览器渲染的一致性。
四、网页中应该使用奇数还是偶数的字体？为什么呢？
答案是：偶数。
原因：

偶数让文字在浏览器上更好看。
ui 给前端的设计图一般都是偶数，这样不管布局也好，转换 px 也好，会方便一些。

感兴趣了，大家找一个左右对称的文字，比如\"中\"、“十”设置一个偶数一个奇数，观察下。
五、css 优先级算法，如何计算？
总结性地回答：
选中且设置 !important 的 > 权重高的 > 权重相同位置靠后的 > 来自继承的。
如果两组选择器都定位到同一元素，且对同一属性设置不同的样式，则需要分别计算两组选择器的权重来确定优先级。
一个选择器的优先级可以由四部分计算得分：

千位：如果声明在 style 的属性里，则该部分得一分。
百位：选择器包含 id 选择器，则该位得一分。
十位：选择器包含类、属性选择器和伪类，则该位得一分。
个位：选择器包含标签、伪元素选择器，则该位得一分。
六、css 盒模型是啥？
网页中每个元素都占有一定的空间，可以看成盒子，这个盒子的组成有：外边距、元素的边框、元素的内边距、元素的内容，这四个部分一起构成了盒子模型。
css 的盒子模型分为两种：标准盒子模型和 IE盒子模型。
6.1、两种盒子模型的区别：
标准盒子模型的内容有：margin、border、padding、content 。
它的 width 一般只包含内容，不包含 padding border 和 margin。盒子的大小会以内容优先，自动扩展，子元素可以撑开父元素。
（标准）盒子总宽度 = margin + border + padding + width
IE盒子模型的内容有：margin、content （padding + border + content ）
IE 盒子中子元素无法撑开父元素的盒模型，元素的宽度实际上包含了 content 、padding 和 border。所以：
（IE）盒子总宽度 = margin + width
6.2、通过 css 如何转换呢？
使用 box-sizing 属性可以任意转换盒子模型。具体的属性值有：
1、content-box ：定义盒子为标准盒子模型，也是默认值。
2、border-box ：定义盒子为 IE 盒子模型。
3、inherit ：规定从父元素继承 box-sizing 属性的值。
通过 box-sizing 属性，可以将标准盒子模型和 IE 盒子模型之间进行任意转换。
七、一个盒子不给宽高，水平垂直居中方式有几种？
共有 6 种方式，分别为：

flex 布局。实现方式为 display:flex 、align-item:center 和 justify-content:center。
flex 布局的另外一种实现方式是 display:flex 和 margin:auto 。
grid 布局其中一种实现方式为 display:grid 、align-item:center 和 justify-content:center。
grid 布局另外一种实现方式是 display:grid 和 margin:auto 。
table-cell 。实现方式为 display:table-cell 、vertical-align:middle 和 text-align:center。
translate + 绝对定位。实现方式为相对和绝对定位相结合，绝对定位的元素添加 left:50%、 top:50% 和 transform:translate(-50%-50%) 。

八、css 中的单位有哪些？以及它们之间的区别。
css 中的单位共有 15 种。它们可分为两大类：
绝对长度：cm、mm、in、px、pt、pc 。
相对长度：ex、ch、em、rpx、rem、vw、vh、vmin、vmax、%。