前端之CSS的零散知识总结

link 和 import区别

• link属于html @import 属于css
• 加载顺序：link和html同时加载 而 @import 等待html记载完毕之后加载
• 兼容性：link更好一些。
• js操作dom样式的时候会有不同。

样式表的权重关系

css三种样式表：内联样式、内部样式表、外部样式表
内联样式权重最高。其次，外部样式表和内部样式表权重相等，
同时出现外部和内部样式表，谁在后边谁的权重更高。

样式表的层叠性

当同一个属性的属性值有冲突时（即有着来自多方的定义时），权重高的会覆盖权重低的。没有样式冲突时，就正常的继续执行下去。
只要产生权重关系，必然产生css的层叠性。
开发者样式>读者样式＞浏览器样式。

导入外部样式表的两种方法

第一种：rel=‘stylesheet’ href=‘路径’
第二种：在style标签内写入 @import url(路径)；

关于选择器和伪类

：hover能更改子元素的样式，但是不能更改父元素的样式。
层级选择器 .box div{} 和 包含选择器.box>div{}的区别，后者只选择第一层子元素。
相邻兄弟元素选择器 + 它只会匹配紧跟着的兄弟元素.
通用兄弟元素选择器 ~ 它会匹配所有的兄弟元素(不需要紧跟)

用通配符来消除默认外边距，性能消耗大，因为并不是所有的标签都有默认外边距，而是把所有标签都清除一遍，因此做了很多无用功。

关于div内元素居中和color属性继承性

让当前元素在父元素中左右居中 margin：0 auto ；
div中color具有继承性。

网页布局中的命名规划

版心区域命名： 类名 .xxxx-con{}
网页最外围结构： id 驼峰命名法||语义化{}
内容部分： 类名 .xxx_{}

文本大小fontsize

a:为了减少系统之间的字体差异，规定16px为标准字体大小。
b：PC端尽量不低于12px
c：设置文本大小一般用偶数
d：获取文本大小，直接从ps中量即可
e：顶线、中线。基线、底线
f：单位： px 像素 pt 磅 9pt==12px
em 默认1em == 16px
rem 根据html的font-size值确定大小

控制文本类型 font-family

a:设备默认字体：微软雅黑
b:web安全字体（系统或者设备能支持的字体）
c:设备默认的英文字体：Arial
d:如果有多个字体的时候，字体用逗号隔开
e:如果字体名称是中文或多个英文单词，需要放在引号里
f:先写英文字体后写中文字体**

控制文本的行高line-height

a:多行文本line-height：60px；让文本在60px的高度里上下居中
b:从px中获取line-height的高度，从第一行量到第二行的开始
c:让单行文本在容器内上下居中，让容器高度等于line-height高度
d:如果容器没有高度，靠单行文本撑开，为消除上下误差，把line-height设置为文本大小即可。

本文地址：https://blog.csdn.net/qq_42698576/article/details/107512568