CSS教程
- CSS 教程
- CSS 简介
- CSS 语法
- CSS id 和 class选择器
- CSS 创建
- CSS Background(背景)
- CSS 文本格式
- CSS 字体
- CSS 链接
- CSS 列表
- CSS 表格
- CSS 盒子模型
- CSS 边框
- CSS 轮廓(outline)
- CSS margin(外边距)
- CSS padding(填充)
- CSS 分组 和 嵌套 选择器
- CSS 尺寸 (Dimension)
- CSS Display(显示)
- CSS Position(定位)
- CSS 布局 - Overflow
- CSS Float(浮动)
- CSS 布局 - 水平 & 垂直对齐
- CSS 组合选择符
- CSS 伪类(Pseudo-classes)
- CSS 伪元素
- CSS 导航栏
- CSS 下拉菜单
- CSS 提示工具(Tooltip)
- CSS 图片廊
- CSS 图像透明/不透明
- CSS 图像拼合技术
- CSS 媒体类型
- CSS 属性 选择器
- CSS 表单
- CSS 计数器
- CSS 网页布局
- CSS !important 规则
分组选择器
在样式表中有很多具有相同样式的元素。
h1
{
color:green;
}
h2
{
color:green;
}
p
{
color:green;
}为了尽量减少代码,你可以使用分组选择器。
每个选择器用逗号分隔。
在下面的例子中,我们对以上代码使用分组选择器:
h1,h2,p
{
color:green;
}嵌套选择器
它可能适用于选择器内部的选择器的样式。
在下面的例子设置了四个样式:
p{ }: 为所有 p 元素指定一个样式。
.marked{ }: 为所有 class="marked" 的元素指定一个样式。
.marked p{ }: 为所有 class="marked" 元素内的 p 元素指定一个样式。
p.marked{ }: 为所有 class="marked" 的 p 元素指定一个样式。
p
{
color:blue;
text-align:center;
}
.marked
{
background-color:red;
}
.marked p
{
color:white;
}
p.marked
{
text-decoration:underline;
}
© 2025 Copyright: kuaikuaixuan.com
京ICP备14015652号-3
网址导航