css选择器总结

css选择器总结

要使用css对html页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到css选择器。html页面中的元素就是通过css选择器控制的。
1.类选择器
类选择器根据类名来选择前面以“.”,例:

.divOne{
   color:red;
}

2.元素选择器
元素选择器又称标签选择器,例:

p{
   background:#fff;
}

3.ID选择器
ID选择器可以让标有特定ID的HTML元素制定特定的样式。根据元素ID来选择元素,具有唯一性,这意味着同一ID在页面中只能出现一次。前面以“#”,例:

#divTow{
font-size:14px;
}

4.后代选择器
后代选择器也称包含选择器,用来选择特定元素或元素组的后代,将对父元素的选择放在前面子元素的选择放在后面,中间用一个空格分开。例:

#a #b #c{
  color:#666;
}

5.子选择器
子选器与后代选择器是有区别的,子选择器仅指它的直接后代,或理解成子元素的第一个后代。而后代选择器是作用于所有子后代元素,它通过空格来选择,而子选择器是通过“>”进行选择。

6.伪类选择器
鼠标悬停等就要用到伪类。伪类不仅可以用到链接标签上,也可用在一些表单元素里。例:

a:hover{
  color:#666;
}

7.通用选择器
通用选择器用“*”来表示。例:

*{
font-size:14px;
}

指所有元素字体大小都是14px,也可以和后代选择器组合使用。例:

p*{
font-size:14px;
}

8.群组选择器
当几个元素样式一样,可以调用一个声明,元素之间用逗号隔开。例:

a,b,c{
font-size:14px;
}

9.相邻同胞选择器
除了找到上面的子元素选择器和后代选择器,我们还希望找到兄弟之间的一个。例:

h1+p{
font-size:14px;
}

10.伪元素选择器
所有伪元素选择器都必须放在出现该伪元素的选择器最后面,也就是说伪元素选择器不能跟任何派生选择器。

… … … … … … … … …
… … … … …

注释:部分引用资料

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值