2022-07-10 第二小组 卢睿 学习笔记

2020.07.10

 

 

CSS层叠样式表

网页美化

样式通常是存储在样式表中 把样式表添加到html元素中

定义css样式

1.行内样式 style=... 行内样式，内联样式 如果当前的样式不需要复用，可以用行内样式

2.内页样式（嵌入样式）

（1）标签选择器

2）类选择器，声明样式的时候需要用一个英文的点，选择样式通过class属性

3）.id选择器 声明样式要用一个#，对应的元素的id要匹配

3.外部样式（推荐）

 

css选择器

1.标签选择器

2.类选择择期 一个标签元素是可以选择多个样式，样式名中间用空格隔开

3.id选择器

4.div，p，选中页面上所有的div和p元素

5.div p，选中div里的p 无论嵌套多少层，都能找到

6.div>p,只要p的上一级是div就行 父子关系

7.div+p 紧跟着div的p

8.[type] 选中页面上所有带有type属性的标签

9.[type=text] 选中页面上所有带有type=text属性的标签

10.[type~=t] 选中页面上type属性包含单词的所有元素

11.伪类选择器 :link :hover :active :visited

12.

nth-child()

13. :checked 选中所有被选中的元素

 

层叠性 如果样式冲突，遵循就近原则，哪个样式离结构近，就执行哪个样式

如果样式不冲突就不重叠

优先级 类>标签>id

继承性 子标签会继承父标签的某些样式，文本颜色，字号，背景颜色

权重 继承的样式权重最低

行内样式权重最高

如果权重相同，就近原则

!important 来改变 权重无限大

 

css常有的单位

1.px像素 绝对单位，一个像素代表一个点

2.em是相对单位 他会参考他的父级元素。字体，父级元素的字体是16px，要设置元素的字体大小为2em，当前元素的大小为32px。

3. rem相对单位 有页面决定。当我们改变了浏览器的字号设置，页面的字号也会随之发生变化。

4. 百分比 相对于父级元素的比例

 

 

 

重点

1.路径问题

2.css引入

3.css的三大特点

4.定位

5.盒子模型