CSS3 新怎的伪类选择器

:first-of-type    p:first-of-type    选择属于其父元素的首个 <p> 元素的每个 <p> 元素。     :last-of-type    p:last-of-type    选择属于其父元素的最后 <p> 元素的每个 <p> 元素。:only-of-type    p:only-of-type    选择属于其父元素唯一的 <p> 元素的每个 <p> 元素。:only-child    p:only-child    选择属于其父元素的唯一子元素的每个 <p> 元素。:nth-child(n)    p:nth-child(2)    选择属于其父元素的第二个子元素的每个 <p> 元素。 :nth-last-child(n)    p:nth-last-child(2)    同上,从最后一个子元素开始计数。:nth-of-type(n)    p:nth-of-type(2)    选择属于其父元素第二个 <p> 元素的每个 <p> 元素。   :nth-last-of-type(n)    p:nth-last-of-type(2)    同上,但是从最后一个子元素开始计数。     :last-child    p:last-child    选择属于其父元素最后一个子元素每个 <p> 元素。  :root    :root    选择文档的根元素。   :empty    p:empty    选择没有子元素的每个 <p> 元素(包括文本节点)。  :target    #news:target    选择当前活动的 #news 元素。:enabled    input:enabled    选择每个启用的 <input> 元素。  :disabled    input:disabled    选择每个禁用的 <input> 元素  :checked    input:checked    选择每个被选中的 <input> 元素。  :not(selector)    :not(p)    选择非 <p> 元素的每个元素。::selection    ::selection    选择被用户选取的元素部分。
时间: 2024-08-11 03:23:26

CSS3 新怎的伪类选择器的相关文章

CSS3新增加的伪类选择器

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>CSS3新增加的伪类选择器</title>    <style type="text/css">    /*root所有的元素*/        :root{            color: pink;      

如何使用CSS3中的结构伪类选择器和伪元素选择器

原文:如何使用CSS3中的结构伪类选择器和伪元素选择器 结构伪类选择器介绍# 结构伪类选择器是用来处理一些特殊的效果. 结构伪类选择器属性说明表 属性 描述 E:first-child 匹配E元素的第一个子元素. E:last-child 匹配E元素的最后一个子元素. E:nth-child(n) 匹配E元素的第n个子元素. E:nth-child(2n)或者E:nth-child(even) 匹配E元素的偶数子元素. E:nth-child(2n+1)或者E:nth-child(odd) 匹配

CSS3(各UI元素状态伪类选择器受浏览器的支持情况)

选择器 Firefox Safari Opera IE Chrome E:hover Y Y Y Y Y E:active Y Y Y N Y E:focus Y Y Y Y Y E:enabled Y Y Y N Y E:disabled Y Y Y N Y E:read-only Y Y Y N Y E:read-write Y Y Y N Y E:checked Y Y Y N Y E:selection Y Y Y N Y E:default Y N Y N N E:indetermin

css3 :enabled与:disabled伪类选择器

css :enabled和:disabled伪类选择器 在Web表单中,有些表单元素(如输入框.密码框.复选框等)有"可用"和"不可用"这2种状态.默认情况下,这些表单元素都处在可用状态. 在CSS3中,我们可以使用:enabled选择器和:disabled选择器来分别设置表单元素的可用与不可用这两种状态的CSS样式. 语法: :disabled { style properties } :enabled { style properties } 如:我们为&quo

css3 巧用结构性伪类选择器

最近在国外的一个网站上看到的一个关于结构性伪类选择器的用法,觉得十分实用,就自己尝试了一下,并把它给记录下来: 这是最基本的样式: 1 <style type="text/css"> 2 li{ 3 list-style-type: none; 4 float: left; 5 width: 60px; 6 height: 60px; 7 background-color: #979698; 8 margin-left: 10px; 9 text-align: center

css3系列选择器之伪类选择器

Pseudo-Classes Selectors(伪类选择器) E:not(s) E:root E:target E:first-child E:last-child E:only-child E:nth-child(n) E:nth-last-child(n)   这一行的选择器,都会考虑其他元素的的影响. E:first-of-type E:last-of-type E:only-of-type E:nth-of-type(n) E:nth-of-last-type(n)   这一行的选择器

css3基础 :target 目标伪类选择器 简单示例

礼悟:    公恒学思合行悟,尊师重道存感恩.叶见寻根三返一,江河湖海同一体.          虚怀若谷良心主,愿行无悔给最苦.读书锻炼养身心,诚劝且行且珍惜.              ide:visual studio 2017             browser:Chrome                     os:win7 学习链接: http://blog.csdn.net/atleks/article/details/38966691 代码 <!DOCTYPE html>

CSS3 01. CSS3现状、属性选择器、伪类选择器、

CSS 3 现状 兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 : CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 | 表示 多选一 ? 表示 0个或1个 * 表示 0个或多个 {}表示范围  {A}代表出现A次 ,{A,B}代表出现A次以上B次以下 ,B可以省略,{A,} 代表至少出现A次,无上限 # 出现1次以上,以逗号隔开,可以选择后面跟大括号的方式精确表示重复次数:<length>#{1,4}. !代表

CSS3 选择器——伪类选择器

前面花了两节内容分别在<CSS3选择器--基本选择器>和<CSS3选择器--属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择器中的第三部分,也是最后一部分--伪类选择器.伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了,因为这些在平时中是常用到的伪类选择器,那么先和大家一起简单总结一下CSS中常用的伪类选择器的使用方法,最后把重心放到CSS3新增加的":nth-child"选择