首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

CSS3选择器

CSS:选择器

选中你想要在文档中运用样式的元素,在对应的选择器中写入你的样式。在CSS3中除了之前就有的一些之外,还加入了很多更加方便我们使用的新选择器。应用他们我们几乎可以选择任何你想要的元素出来。

基础选择器

类型选择器

通过html标签的名称来选中对应的元素,比如:

通用选择器

使用通用选择器会选择所有的元素

类选择器

通过在html标签中加入class类来进行选择

ID选择器

通过在html标签中加入id属性来进行选择,一般id具有全局唯一性。

属性选择器

我们可以将元素的属性作为选择器,用[ ]加入属性进行使用,我们也可以使用多个[ ]从而选择同时拥有多个属性的元素。属性后面还可以带上相应的值。

伪类

浏览器一般会在没有访问过的链接上使用的伪类,在访问过的链接上使用伪类。

这样就可以看出链接是否被访问过。

有一些跟用户动作相关的伪类,可以根据不同的动作做出相应的变化。会在鼠标指针移动到元素上时做出变化。元素在激活状态下可以使用对元素做出改变。还有会在元素处于焦点状态下做出改变,比如选中文本框。

在文档内部去使用作为一个链接的时候,当用户点击了这个的链接,被链接的那个元素上面会应用一个的伪类。

在输入框上运用一个的属性:表示禁用这个输入框,有了这个属性以后我们可以在这个输入框上运用一个的伪类,来设置被禁用时的样子。

这个伪类可以去选择完全空白的元素。

是一个否定的伪类,我们可以将一个简单的选择器作为一个参数给来选择不匹配指定选择器的元素内容。

伪元素

想要选择每一段落的第一行我们可以用来选择。

选择第一行第一个文字我们可以用。

这个伪元素可以选择之前,可以在元素之前去添加点内容、修改样式。

与之对应。

组合

用空格分隔开不同的选择器,这种类型就是组合选择器。比如选择后裔的元素。用选择不包括子元素的后裔元素。

如果选择元素的直接子元素,不包括其他的后裔,可以使用来表示,比如选择下的子元素:

我们可以选择元素下一个临近的兄弟元素,或者是元素后面的兄弟元素,不临近的也可以。在选择器里面使用表示选择前面元素的下一个相邻兄弟元素,比如选择下面的兄弟元素:

如果是不相邻的兄弟元素我们可以用。

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20180423G1UTF700?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券