本文将以哔哩哔哩网站为例浅浅分析相关的CSS知识
一.基础认知
- CSS（层叠样式表：Cascading style sheets）它的作用是决定样式美观，给HTML标签设置样式。
- 书写位置有三种：（1）内嵌式，style标签虽然可以写在页面任意位置但是一般写在title标签下的head标签里的style标签中。（2）外联式，CSS 写在一个单独的.css文件中且需要通过link标签在网页中引入。（3）行内式，CSS写在标签的style属性中。对于同一对象同一属性的运行优先级为：行内式>内嵌式>外联式。
- 修改相应标签需要用到选择器选中对应标签。选择器有八种：（1）标签选择器，以标签名命名的选择器。（2）类选择器，通过类名找到页面中所有带有这个类名的标签，可设置样式。所有标签上都有class属性，class属性的属性值称为类名。（3）ID选择器，一个ID选择器只能选中一个标签，一个标签上只能有一个ID属性值。（4）通配符选择器，可以找到页面中所有的标签并设置样式。（5）复合选择器：分为两种，一种是后代选择器，根据HTML标签中的嵌套关系选择父元素后代中满足条件的元素。一种是子代选择器，根据HTML标签的嵌套关系选择父元素子代中满足条件的元素。（6）并集选择器，同时选择多组标签设置相同的样式。（7）交集选择器，选中页面中同时满足多个选择器的标签。（8）hover伪类选择器，选中鼠标悬停在元素上的状态设置样式。 2.CSS3提供了很多属性，可以设置字体，文本修饰，设置背景，元素显示等 3.网页常见布局方式：（1）标准流，垂直布局与水平布局。（2）浮动，可以让原本垂直布局的块级元素变成水平布局。（3）定位，可以让元素自由地摆放在网页的任何位置。一般用于盒子之间的层叠情况。
二.案例分析
我们从导航栏的第一个li标签看起，这个链接标签的类名为entry-title，从下面的样式中可以看出它是通过两个选择器一起来定义它的样式。第一个为通过交集选择器选到它在和其他交集选择器并在一起共用一个样式，它设置了行高，颜色，字体大小，鼠标样式。第二个选择器决定了它的居中的对齐方式，排列样式为flex。
三.总结
还有很多相关知识，比如浮动，定位。以后再写。
