快速检查错误,比如这里单词没写对
image.png
先写结构, 一个是并列,一个是嵌套
兄弟并列,子元素缩进
两个一样的样式,后面的层叠先写的,但是不同的属性两个都可以实现
image.png
层叠性:
- 在CSS中,不同属性都可以实现,相同属性当权重相同的情况下,后定义的会层叠先定义的
- 当权重不同时,谁的权重高听谁的
div名字里面加个id
image.png
image.png
权重的顺序
- 标签<类名<id<行内<!important
1 10 100 1000 无穷大
.one给的红色,如果三个属性都没实现,肯定是类名写错了
image.png
-
继承,从.one继承
image.png
CSS继承性
- 标签可以继承父辈元素所有关于文本的属性,继承的权重是0
常用选择器
- 类,后代,伪类
- 伪类选择器
- 第一种:li:first-child;li:nth-chidl(2){} 这是找排在第二位的
- 第二种li:nth-of-type(2)这是找亲生的
- 表达式必须是n,n是从0逐渐递增的
或者first-of-type,区别在于是不是亲生的
- 表达式必须是n,n是从0逐渐递增的
- 第三种ul:last-of-type
以上都属于c3选择器
image.png
image.png
最终是粉色
image.png
块元素的水平居中和默认宽度
*{ margin:0; height:0: }
设置固定宽度的块元素居中
块元素在不设置固定宽度时,和父元素宽度一样,当人为设置水平方向的内外边距时,不会撑大盒子,或者父盒子,然后宽度会进行自动计算