css语法,选择器

css语法

cacadiong style sheets 层叠样式表。
简称css，规定HTML标签在页面上显示的方式。

使用HTML也可以写样式，但是有四个缺点
1.代码比较臃肿
2.可读性较差
3.不便维护
4.对搜索引擎不友好，搜索引擎更关心内容

使用css的优点：
1.代码简洁
2.可读性较强
3.便于维护
4.对搜索引擎友好，更关心内容

css基础语法
选择器{
属性：属性值：
}

属性：属性值；（声明）
声明都是由属性和属性值组成。中间用：或， 用；结尾分开
选择器：选择页面中的那些元素去修改样式
属性：属性值；要修改成什么样式

书写位置
1.行内式
直接写在标签style属性中
写法
<标签 style="…"></标签>

优缺点：写法简单，但是结构样式没有分离，只对当前标签生效，不能重复使用

2.内嵌式
在head标签内，使用style标签,写在里面
写法

优缺点：如果样式较多，页面代码就会比较多。
只对当前页面生效，如果有多个页面有共同的样式，就需要写多次
结构和样式分离
样式可以重复利用

3.外链式
写到外部文件中，通过link标签链接引入
写法

先加载css，在加载HTML 优缺点 结构样式分离 样式可以重复使用 可以多个页面使用

4.导入法
在head标签内，使用style标签,写在里面
写法

先加载HTML页面，在加载css

选择器

选择器就是选择页面上的元素进行样式的修改

1.标签选择器
通过标签名来选择相应的标签

会选择页面中所有相应的标签，不管嵌套多少标签

利用标签选择器进行默认样式的初始化

它会选择当前页面中的所有相应的标签，说以不会用来更改某一个标签的样式

2.ID选择器
通过标签设置一个ID值，通过ID值来选择标签
写法
#id值{
属性：属性值;
)
写法规范
以字母开头，后面可以是数字，下划线或横线

因为一个页面的ID值是唯一的，ID选择器只会选择一个标签
所以如果有多个标签要写相同的样式，使用ID选择器的时候需要分别给他们设置ID值，然后在重复的设置一样的样式

ID常用的场景;配合js去添加事件的

3.类选择器
通过标签的class属性选择相应的标签
class值是可以重复的

写法
.class属性值{
属性：属性值；
}

类选择器选择的是拥有相同class属性的元素标签

class属性是可以有多个的，css样式书写最多的就是类选择器