欢迎光临
我的个人博客网站

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


分组选择器

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

    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;     }

赞(0) 打赏
未经允许不得转载:张拓的天空 » 教你玩转CSS 分组选择器和嵌套选择器
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

专业的IT技术经验分享 更专业 更方便

联系我们本站主机

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏