CSS:页面美化和布局控制
1.概念: Cascading Style sheets层叠样式
层叠:多个样式可以作用在同一个htm1的元秦上,同时生效
2.好处
1.功能强大
2.将内容展示和样式控制分离
降低耦合度。解耦
让分工协作更容易
捉高开发效率
3.CSS的使用:CSS与html结合方式
1.内联样式
在标签内使用 style属性指定css代码
如:<div style="color:red;">hello css</div>
2.内部样式
*在head标签内,定义sty1e标签,sty1e标签的标签体内容就是css代码
如
<style>在head里写
div(看5){
color: blue;
}
</style>
<div>hello css</div>
3.外部样式
1.定义css资源文件。
2.在head标签内,定义1ink标签,引入外部的资源文件
如
a.css文件
div(看5){
color:green;
}
<link rel="stylesheet(这个不知道干啥的先这样写) href="a.css">在head里写
后期常用2,3
4.CSS语法:
格式
选择器{
属性1:属性值1;
属性2:属性值2;
...(最后一对可以不加;)
}
5.选择器:
分类
1.基础选择器
1.ID选择器:优先级:1
语法: #id属性值(标签中的id的属性值){}
2.标签选择器:优先级:3
语法: 标签名称{}
3.类选择器:优先级:2
语法: .class属性值(标签中的class的属性值){}
2.扩展选择器:
1.选择所有元素:
语法: *{}
2.并集选择器:
选择器1,选择器2{}
3.子选择器:筛选选择器1下的选择器2
选择器1 选择器2{}
4.父选择器:筛选有选择器2的选择器1
选择器1 > 选择器2{}
5.属性选择器:
语法: 标签名称[属性名="属性值"]{}
举例: input[type="text"]{}
6.伪类选择器:选择一些标签具有的状态
语法: 标签:状态{}
6.属性:
