当前位置:首页 > 参考手册-选择符
3.21 @page :first
设置在打印时页面容器第一页使用的样式。仅用于@page规则。
? 该伪类选择符只允许定义margin, orphans, widows 和 page breaks相关属性 ? 相关查看:@page, :left, :right HTML示例代码:
3.22 @page :left
设置页面容器位于装订线左边的所有页面使用的样式。仅用于@page规则。 ? 该伪类选择符只允许定义margin, padding, border 和 background属性 ? 相关查看:@page, :first, :right
3.23 @page :right
设置页面容器位于装订线右边的所有页面使用的样式。仅用于@page规则。 ? 该伪类选择符只允许定义margin, padding, border 和 background属性 ? 相关查看:@page, :first, :left 四、伪对象选择符
4.1 E:first-letter/E::first-letter
设置对象内的第一个字符的样式。
? 此伪对象仅作用于块对象。内联对象要使用该伪对象,必须先将其设置为块级对象。 ? 该伪类常被用来配合font-size属性和float属性制作首字下沉效果。
? IE6在使用该选择符时有个显式的BUG:选择符与包含规则的花括号之间不能紧挨着,需留有空格或换行。同时还存在该BUG的选择符包括:E:first-line
? CSS3将伪对象选择符(Pseudo-Element Selectors)前面的单个冒号(:)修改为双冒号(::)用以区别伪类选择符(Pseudo-Classes Selectors),但以前的写法仍然有效。
? 即E:first-letter可转化为E::first-letter
HTML示例代码:
今天,阳光明媚,晴空万里,非常适合户外活动,如踏青、远足之类的。长期坐在办公室的同学们要多注意运动。
4.2 E:first-line/E::first-line
设置对象内的第一行的样式。
? 此伪对象仅作用于块对象。内联对象要使用该伪对象,必须先将其设置为块级对象。 ? IE6在使用该选择符时有个显式的BUG:选择符与包含规则的花括号之间不能紧挨着,需留有空格或换行。同时还存在该BUG的选择符包括:E:first-letter
? CSS3将伪对象选择符(Pseudo-Element Selectors)前面的单个冒号(:)修改为双冒号(::)用以区别伪类选择符(Pseudo-Classes Selectors),但以前的写法仍然有效。
? 即E:first-line可转化为E::first-line HTML示例代码:
今天,阳光明媚,晴空万里,非常适合户外活动,如踏青、远足之类的。长期坐在办公室的同学们要多注意运动。
4.3 E:before/E::before
设置在对象前(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用,并且必须定义content属性
? CSS3将伪对象选择符(Pseudo-Element Selectors)前面的单个冒号(:)修改为双冒号(::)用以区别伪类选择符(Pseudo-Classes Selectors),但以前的写法仍然有效。
? 即E:before可转化为E::before HTML示例代码:
Sorry, 你的浏览器不支持E:before和E::before
4.4 E:after/E::after
设置在对象后(依据对象树的逻辑结构)发生的内容。用来和content属性一起使用,并且必须定义content属性
? CSS3将伪对象选择符(Pseudo-Element Selectors)前面的单个冒号(:)修改为双冒号(::)用以区别伪类选择符(Pseudo-Classes Selectors),但以前的写法仍然有效。
? 即E:after可转化为E::after HTML示例代码:
Sorry, 你的浏览器不支持E:after和E::after
4.5 E::placeholder
设置对象文字占位符的样式。
? ::placeholder 伪元素用于控制表单输入框占位符的外观,它允许开发者/设计师改变文字占位符的样式,默认的文字占位符为浅灰色。
? 当表单背景色为类似的颜色时它可能效果并不是很明显,那么就可以使用这个伪元素来改变文字占位符的颜色。
? 需要注意的是,除了Firefox是 ::[prefix]placeholder,其他浏览器都是使用 ::[prefix]input-placeholder
? Firefox支持该伪元素使用text-overflow属性来处理溢出问题。 ::placeholder的使用示例:
input::-webkit-input-placeholder {color: #999;} input:-ms-input-placeholder { // IE10+
共分享92篇相关文档