2022.07.10 第九小组 王茜 学习笔记

今天是第二天的学习，经过了第一天的兵荒马乱，第二天相对来说更适应了一点，但所对应的知识也更难了

知识点：

CSS层叠样式表

网页美化

html相当于布料，上色

如何嵌入

样式如何显示html元素

样式通常是存储在样式表中

把样式表添加到HTML元素中

 

定义css样式的方式

1、行内样式 好不好？

 如果当前的样式不需要复用，可以用行内样式

 优先级

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

 （1）标签选择器

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

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

3、外部样式（推荐）

 

css选择器:   

style

*1.标签选择器   行内 内页 （在head中）

*2. 类选择器   内页 class（.）一个标签元素是可以选中多个样式 样式名中间用空格隔开

3. id选择器（#  用得少）

引入外部样式：link 

4.div,p 并列选择器  选择所有的div和p

*5. div p 嵌套选择器  选中里面的P,无论多少层，都可以找到（常用）

*6.div>p :选中div里面的直接字标签p（常用）

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：选中所有被选中的元素

 

css层叠样式表

层叠性： 1.如果样式冲突，遵循就是就近原则（哪个样式离结构近，就执行哪个样式）

              2.如果样式不冲突，直接用

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

优先性： 类 > 标签 > id

权重：1.继承的样式权重为0

          2.行内样式权重最高

          3.如果权重相同，又是就近原则

          4.!important无限大

css常用的单位：

1、px像素：绝对单位，一个像素代表一个点。如100px*100px的正方形，宽度100个点，高度100个点。

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

3、rem相对单位。由页面决定。当我们改变了浏览器的字号设置，页面的字号也会随之发生变化。应用在老人版。

4、百分比：相对于父级元素的比例。

 

font-size字体大小

font-family字体样式

line-height行高

font-weight：bold 粗细

text-decoration:underline 字体下划线  line-through 删除