2021-07-16 CSS样式优先级、单位基础、颜色

1.CSS样式优先级

/* 类名选择器（属性选择器、伪类选择器 选择器权重 一样） */
[name]{
    color:red;
}

/* 伪类 没有 id高 */
:hover{
    color: blue;
}

/* 类名 低于 id  */
.item{
    color:red;
}

/* 元素选择器 低于 类名选择器 */
p{
    color: green;
}


/* 通配符 低于 元素选择器 */
*{
    color: brown;
    font-weight: bolder;
    color: black!important;
}

/* 继承的样式 低于通配符 */
body{
    color: darkblue;
}

/* 浏览器默认样式 */

2.单位基础

前端的尺寸单位:
% ：相对于父元素尺寸的百分比大小（比如div块定义了宽高百分比，但是相对于父元素html，body没有定义宽高百分比的话，div块是显示不出来的）
px ：像素点。用多个像素点来显示一个像素越高清，老师说的…
em ：相对单位, 1em 等于 父元素的一个字体大小
rem ：相对单位, 专门用于做移动设备适配的, 相对于一个HTML的字体大小
视口 ：浏览器屏幕的可用区域， 即除了 任务栏 标题栏 底部工具栏 之外的浏览器可视区域

vw ：1vw = 一个视口宽度的 1%;
v