标签的权重 也就是说标签也会分先后 计算机会优先考虑那些权重大的标签
标签的权重 1
class的权重 10
id 的权重 100
!important; 无限大的权重
(权重可以叠加)
如有两个相同的权重 计算机会优先识别后面的标签 也就是说后面的标签会把前面的覆盖掉
计算机执行代码的顺序为 从上往下 从左往右
如<p>
<a class="a1 a3" id="a2"><h>大神</h></a>
</p> 他们的内容一样
在<style>里面改他们的颜色
列一 <style>
.a1{
color:red;
}
.a3{
color:blue;
</style> 在这个里面,.a3会覆盖掉.a1的内容 因为他们的权重都一样 但.a3在.a1的后面
列二 <style>
.a1 h{
color:red;
}
.a3{
color:blue;
</style> 在这个里面, 计算机便会执行.a1的内容 因为.a1的权重是11 而.a3的权重是10
列三 <style>
.a1 h{
color:red;
}
.a3{
color:blue;
#a2{
color:yellow;
</style> 在这个里面 计算机会执行#a2的内容 ,因为#a2的权重是100
选择器的种类
1 标签选择器
2 id选择器
3 class选择器
4 后代选择器 讲这个之前做个人设 爷爷 爸爸 儿子 这三个角色 后代选择器 如果说的爷爷的后代 那系统默认爸爸和儿子 p d
5 子代选择器 子代则是 如果说爷爷的子代 那系统默认的是爸爸 p>d
6 交集选择器 交集便是标签 id class 的结合体 它里面的内容可以用标签表示 id表示 class表示
css 样式
1行间样式 style当作属性写在标签内 <p style="color:red;">H5大神</p> 这个的权重是1000
2行内样式 style当作标签写在head之间 <style> p{ color:red;} </style>
3外部引入 把style当作css文件用在html中 <link type="text/css" rel="stylesheet" herf="./01.css"> (rel和herf是必不可少的)
文本类型 样式表 文件路径
4行间引入 把css文件中的东西嵌入到另一个css文件 需要用到 @import url("02.css");
5引入favicon.ico图标 <link rel="shortcut icon" href="favicon.ico">
p标签 : 双标签必须要用到结束标签,但p可以忽略到里面的标签,P中间随便一个标签都可以作为p的结束标签
margin:o auto; 失效的问题 我们可以在父元素上设置 text-align:center 来实现对内敛元素的居中,图片 ,文字等等