教你玩转CSS 分组选择器和嵌套选择器

分组选择器

嵌套选择器

分组选择器

在样式表中有很多具有相同样式的元素。

    h1 {color:green;}h2 {color:green;}p {color:green;}

为了尽量减少代码，你可以使用分组选择器。

每个选择器用逗号分隔。

在下面的例子中，我们对以上代码使用分组选择器：

    h1,h2,p {color:green;}

嵌套选择器

它可能适用于选择器内部的选择器的样式。

在下面的例子设置了三个样式：

p{ }: 为所有 p 元素指定一个样式。
.marked{ }: 为所有 class=“marked” 的元素指定一个样式。
.marked p{ }: 为所有 class=“marked”

教你玩转CSS 分组选择器和嵌套选择器相关推荐

教你玩转CSS 组合选择符
目录后代选择器子元素选择器相邻兄弟选择器后续兄弟选择器 CSS组合选择符包括各种简单选择符的组合方式. 在 CSS3 中包含了四种组合方式: 后代选择器(以空格分隔) 子元素选择器(以大于号分 ...
如何玩转CSS的Id 和 Class选择器？
目录 id 和 class 选择器 id 选择器 class 选择器 id 和 class 选择器如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 &quo ...
教你玩转CSS 属性选择器
目录具有特定属性的HTML元素样式属性选择器属性和值选择器属性和值的选择器 - 多值表单样式 CSS 属性选择器具有特定属性的HTML元素样式具有特定属性的HTML元素样式不仅仅是cl ...
教你玩转CSS 媒体类型
目录 CSS 媒体类型媒体类型 @media 规则其他媒体类型 CSS 媒体类型媒体类型允许你指定文件将如何在不同媒体呈现.该文件可以以不同的方式显示在屏幕上,在纸张上,或听觉浏览器等等. 媒体 ...
教你玩转CSS 图像透明/不透明
目录图像的透明度 - 悬停效果透明的盒子中的文字使用CSS很容易创建透明的图像. 注意:CSS Opacity属性是W3C的CSS3建议的一部分. img{opacity:0.4;filter: ...
教你玩转CSS响应式设计
目录什么是 Viewport? 设置 Viewport CSS 网格视图什么是网格视图? 响应式网格视图 CSS 媒体查询添加断点
教你玩转CSS 提示工具(Tooltip)
如何使用 HTML 与 CSS 来创建提示工具. 提示工具在鼠标移动到指定元素后触发基础提示框(Tooltip) 提示框在鼠标移动到指定元素上显示: <style>/* Tooltip ...
教你玩转CSS 下拉菜单
目录基本下拉菜单实例解析下拉菜单下拉内容对齐方式使用 CSS 创建一个鼠标移动上去后显示下拉菜单的效果. 基本下拉菜单当鼠标移动到指定元素上时,会出现下拉菜单. <style> ...
教你玩转CSS 导航栏
目录 CSS 导航栏导航栏导航栏=链接列表垂直导航栏垂直导航条实例激活/当前导航条实例创建链接并添加边框

教你玩转CSS 分组选择器和嵌套选择器

分组选择器

嵌套选择器

教你玩转CSS 分组选择器和嵌套选择器相关推荐

最新文章

热门文章