霍者博客

HTML5,CSS3属性选择器集合:速度收藏先

引用样式表 //内联,行内,外部引用(<link rel="stylesheet" href=""/>)

!important //强制优先级。 添加在CSS属性后面。

}

属性选择器:{ E选择的元素。

E[att]:{ } //选择为具有att属性的添加样式。

e[att=”val”]{ } //选择具有att=””相同格式,添加新的样式。

E[att~=”15px”]{ } //选择具有att属性且属性值有多个,为其中的相同值(15px)添加新的样式。

E[att|=”val”]{ } //选择具有att 属性且属性值以val开头并用连接符“|”分隔的字符串的E元素。

E[att^=”val”]{ } //选择具有att属性且属性值为以val开头的字符串的E元素。(a[href^=“HTTP”]{ 开头})

E[att$=”val”]{ } //选择具有att属性且属性值为以val结尾的字符串的E元素。(a[href$=“cn”]{结尾 })

E[att*=”val”]{ } //选择具有att属性且属性值为包含val相同的字符串的E元素。(a[href*=“www”]{中间 })

}

关系选择器:{

Ul li{ } //后代选择器。

Ul>li{ } //子元素选择器:只选择后者。(颜色有继承权。)

E+F{ } //选择E元素紧挨着的F元素包括之后的所有元素。

E~F{ } //选择E之后所有的F元素。

}

伪元素选择器:{

E:first-letter{ }/E::first-letter{ } //选择元素中第一个字符。

E:first-line{ }/E::first-line{ } //选择元素中的第一行样式。

E:before{ }/ E:before{ } //为元素前面添加一个字符。 使用格式:(content:””)

E:after{ }/ E:after{ } //为元素后面添加一个字符。 使用格式:(content:””)

E::selection{ } //设置对象被选择时的颜色。

}

伪类选择器:{

:root{ } //选择根元素,也就是整个HTML

E:first-child{ } //选择子元素下的第一个元素。

E:last-child{ } //选择元素下的最后一个元素。

E:only-child{ } //选择子元素下,仅有的唯一独立的元素。

E:only-of-type{ } //选择子元素下,同类型元素中唯一的元素。

E:nth-chiid( ){ } //选择元素下,第N个元素。(1,键入数字。2,奇数(odd),偶数( even)。3,公式3N(3N+1)···)

E:nth-last-child( ){ } //选择元素下,第N个元素。 倒数,同上。

E:first-of-type{ } //选择元素下,同一类元素的第一个。

E:last-of-type{ } //选择元素下,同一类元素的最后一个。

E:nth-of-type( ) { } //区配同类型中第N个同级元素。 (1, 2, 3同上)

E:nth-last-of-type( ){ } //匹配同类型中倒数的第N个同级元素。 (1, 2, 3同上)

E:empty { } //匹配没有任何子元素包括TEXT节点的元素。

}

UI伪类,及其它选择器{

E:active //向被激活的元素添加样式。

E:hover //当鼠标移动到元素上方时,向元素添加样式。

E:link //向未被访问的链接添加样式。

E:visited //向已被访问的链接添加样式。

E:focus //向拥有键盘输入焦点的元素添加样式。

E:lang() //向带有指定lang属性的元素添加样式

Input:checked //选择每个被选中的input元素。

Input:disabled //选择每个禁用的input元素。

Input:enablad //选择每个启用的input元素。

#E:target //选择当前活动的锚点元素。(某个被连接的元素)

:not(E) //选择E元素之外的每个元素

}

颜色:{

CSS2 //英文,十六进制,RGB。没有透明度。

CSS3{

RGBA //RGBA(255,255,255,0.5)0完全透明,1不透明。

HSL //hsl(色调,饱和度,亮度。)(0-360),(100%),(100%)

HSLA //hsla(色调,饱和度,亮度,透明度) (0-360),(100%),(100%),(0-1)

}

字体嵌入:{

@font-face{

Font-family:”abc”; //命名字体

Src:url(‘字体文件’) //引入字体

}

文本属性:{

Text-shadow //文本阴影(X,Y,模糊度,颜色)多以同时附加多个阴影。用逗号隔开。

}

原创文章请注明转载自霍者博客本文地址:http://www.huozheweb.com/post/564.html,标题:HTML5,CSS3属性选择器集合:速度收藏先

【我来说两句】
分享到:

评论 0

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。