CSS需要掌握哪些知识点

1、CSS三种样式表

工作中外部样式表运用较多，原理一样，知识CSS代码书写位置不同

2、CSS代码具体规则

3、CSS选择器（重点）

3.1CSS选择器的作用

选择器就是为了选择特定的HTML元素（标签）

3.2、CSS基础选择器

总的来说，类选择器是我们工作中最常用的

• 尽量少用通用选择器
• 尽量少用ID选择器
• 不使用无具体定义的标签选择器 div span

4、CSS样式属性调试工具

4.1、font字体

4.2、CSS外观属性

• 行高一般比我们的文字大7-8个像素，一般浏览器文字为16px，所以我们行高一般设为24px

注意事项

当图片中的第三个div设置了text-align: center;居中后，我们要是想要搜索框居中，就可以使用margin-left: 110px;（100px可自由改动）使其居中效果再向右移动

最后得到这种效果

5、CSS复合选择器

注意
因为a链接浏览器具有默认样式，所以我们实际工作中都需要给链接单独指定样式
a标签选择器和链接伪选择器要分开写

5.标签显示模式（display）重点

标签显示模式的转换

补充

如果想要让单行文本垂直居中，就需要将行高设置等于高度：line-height = height

6.CSS背景（background）

7.CSS三大特性

7.1CSS层叠行

7.1CSS继承性

7.1CSS优先级（重点）

8.盒子模型（CSS重点）

8.1盒子模型

8.2盒子边框

综合写法


表格细线边框

8.1.内边距

就是指边框与内容之间的距离

注意

1、内边距会撑大原来的盒子
解决：通过设置了宽高的盒子，减去相应的内边距的值，维持盒子原来的大小

2、padding不行影盒子大小情况
如果没有给一个盒子指定宽度，此时，如果给这个盒子指定padding，则不会撑开盒子

8.2.外边距

其复合写法和padding一样