CSS 备忘录-基础内容

目录

1、CSS的基本结构

2、样式表的来源以及优先级

3、选择器的优先级 

4、源码顺序

5、px、em、rem单位

6、视口相对单位

7、使用 calc() 来定义属性值

8、一些无单位的属性

9、自定义属性

10、使用 JavaScript 来动态修改自定义属性

11、overflow 属性

12、子元素定位于父元素中央常用实现方法

 12-1）绝对定位方式

12-2）flex 布局

12-3）grid布局

13、猫头鹰选择器

14、让文本居中显示

1）使用 line-height 和 text-align

2）使用flex

15、FlexBox弹性容器布局

16、gird 网格布局

17、如果有文本溢出提前用省略号代替

1、单行文本的省略号处理：

 2、多行文本的省略号处理：

3、如果是多行文本但是没有控制好高度和行高：

18、 使用伪元素来绘制CSS三角形

19、input 元素自带的两个可能想覆盖的样式

---

1、CSS的基本结构

        以下是CSS的一个声明，由一个属性和一个值组成：

color:black;

        包含在大括号内的一组声明被称作一个声明块。声明块前有一个选择器。选择器和声明块一起构成一个规则集。

        下面是一个规则集：

.my-img{
    width: 100vw;
    height: auto;
}

2、样式表的来源以及优先级

        浏览器默认的样式是用户代理样式表；作者样式表是我们开发者自己写的样式表，如果有相同的声明，则作者样式表将覆盖用户代理样式表中的声明。

        标记了!important的声明会被当做更高优先级的来源，很难被覆盖掉，应该尽量少使用。

color:black !important;

        行内样式将直接覆盖任何样式表或来自