选择器


选择器

id选择器

唯一

<div id="box"></div>

#box {

}

类选择器

<div class="box"></div>

.box {

}

可以是多个class加在同一个元素上

标签选择器

div {

width:100px;

height:100px;

}

当前页面上所有标签为xxx的元素

群组选择器

div,p,h1 {

width:100px;

height:100px;

color:pink;

}

用逗号分隔,被逗号分隔的元素统一使用相同的样式

包含选择器

.box div {

}

目标范围 目标元素

通配符

body * {

margin:10px;

pading:10px;

border:1px solid #fff;

}

找到页面上符合规则的所有元素

不建议使用

选择器的优先级

代码执行生效的顺序:

行间样式> id选择器 > 类选择器 > 元素选择器

行间样式 1000

id选择器 100

类选择器 10

元素选择器 1


文章作者: dlwin888
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 dlwin888 !
 上一篇
块元素和内联元素 块元素和内联元素
块元素和内联元素块元素特征 默认独占一行 没有宽度时,默认撑满一行 支持所有css命令 内联元素特征 同排可以继续跟相同类型的标签 内容撑开高度 不支持宽高 不支持上下的margin 代码换行被解析–空格 块和内联的转换display
2022-09-07
下一篇 
标签样式初始化 标签样式初始化
标签样式初始化css reset 原则: 但凡是浏览器默认的样式,都不要使用。 因为每个浏览器下标签的默认样式可能会出现不一致的情况。 人为的将所有样式全部统一(清除),再根据实际情况(设计稿)统一设置。 哪些样式是需要重置的 ​ 与盒模型
2022-09-06