Rumah > hujung hadapan web > html tutorial > css3中的伪元素_html/css_WEB-ITnose

css3中的伪元素_html/css_WEB-ITnose

WBOY
Lepaskan: 2016-06-24 11:34:54
asal
1004 orang telah melayarinya

CSS中的伪元素大家以前看过::first-line,:first-letter,:before,:after;

那么在CSS3中,他对伪元素进行了一定的调整,在以前的基础上增加了一个“:”也就是现在变成了::first-letter,::first-line,::before,::after另外他还增加了一个::selection。

在css3中,已经明确规定了伪类用一个冒号来表示,而伪元素则用两个冒号来表示。

::first-line选择元素的第一行,比如说改变每个段落的第一行文本的样式,我们就可以使用这个

p::first-line {font-weight:bold;}
Salin selepas log masuk

::before和::after这两个主要用来给元素的前面或后面插入内容,这两个常用"content"配合使用,见过最多的就是清除浮动,

            .clearfix:before, .clearfix:after { content: "."; display: block; height: 0; visibility: hidden; } .clearfix:after {clear: both;} .clearfix {zoom: 1;}
Salin selepas log masuk

对于 IE8 及更早版本中的 :before,必须声明 。

:before 选择器在被选元素的内容前面插入内容。例如:

<div> <h1>welcome</h1></div>div:before{ content:"hello world"}
Salin selepas log masuk

那么,被选元素是div,div的内容是h1,插入的内容就是content属性值“hello world”

::selection用来改变浏览网页选中文的默认效果

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan