011.属性选择器022.子元素选择器023.兄弟元素选择器024.否定伪类025.样式的继承026.选择器的优先级027.a的伪类028.文本标签029.列表030.单位031.颜色

011.属性选择器:

title:鼠标移动上去有提示

p【title】{}:表示所有p元素带有title可以变化

p[title="..."]{}:可以调节。。。来变化

p[title^($)(*)="..."]{

                       background-color:颜色

                        }

^:开头

$:结尾

*:包含

---

022.子元素选择器:

p:first-child{

                     background-color:yellow;

                     }

p标签的背景变成黄色/////////！！！必须为p标签然后还是第一个子元素，只要是第一个，不管在哪里都会变黄色（在bidy里）

（first：第一个）（last：最后一个）

first-child：

选择第一个子标签

last-child：

选择最后一个子标签

nth-child：

选择指定位置的子元素

first-of-type：

last-of-type：

nth-of-type：

选择指定类型的子元素

---

023.兄弟元素选择器

span + p{

    background-color: yellow;

}

span后一个

变颜色。

span ~ p{

background-color: yellow;

}

span后面

都变颜色

---

024.否定伪类

p:not(.hello){

background-color: yellow;

} 

除了class=“hello”不变其他都变

p:not(#p1){

background-color: yellow;

} 

除了 id为p1的不变别的都变

---

025.样式的继承

我是p标签的文字

我是span中的文字

我是p元素外的span

和里面的变大，外面,不变

            

            我是p标签的文字

            我是span中的文字

            

为儿子继承了

的大小。（在

里的元素都会继承）

body{

font-size: 30px;

}

里都会继承

我是p标签的文字

我是span中的文字

---

026.选择器的优先级

内联样式1000

id选择器 100

类和伪类选择器10

元素选择器 1

通配* 0

继承的样式没有优先级

并集选择器的优先级是单独计算的

div，p，#p1，.hello{}

！不推荐写内联样式

（！）！important最高

同等级后面会覆盖前面的

027.a的伪类 

:link

:visited

:hover

:active

而这四个选择器的优先级是一样的

028.文本标签

em标签用于表示一段内容中的着重点。

strong标签用于表示一个内容的重要性。

通常em显示为斜体，strong显示为粗体。

：斜体 可以放icon小图标                     粗体   ：纯表现标签

small：小字       big：大字                 css引号         斜体

块元素可以用来引用        变成右上角的小字        变小向下靠

表示插入的内容，显示时通常会加上下划线

表示删除的内容，显示时通常会加上删除线

shift+tab：减少缩进

029.列表

在网页中一共有三种列表：

1.无序列表：ul li

2.有序列表：ol li

3.定义列表: dl dt dd

030.单位

分辨率的长乘宽就是像素

手机的像素是电脑的4/1px

%会根据它的父元素的尺寸来计算他的尺寸

em 1em = 1font-size       1em=20

字体字号相关的样式用em

031.颜色

mk:@MSITStore:C:\Users\�屡����\Documents\WeChat%20Files\kangxintaiw\FileStorage\File\2019-10\W3School�����ֲ�(2015.07.17)(1).chm::/www.w3school.com.cn/cssref/css_colornames.asp

截图上面有颜色的代码！

可以用百分号，16进制

background-color: blue;

background-color: rgb(0,0,255);

background-color: rgb(100%,100%,100%);（白）

background-color: #00ff00;