您好,欢迎访问一九零五行业门户网

CSS中伪类和伪元素的区别

伪类伪类表示选择器的状态,如:hover、:active、:last-child等。它们以一个冒号(:)开头。
css伪类的语法如下 -
:pseudo-class{ attribute: /*value*/}
伪元素同样,伪元素用于选择虚拟元素,如::after、::before、::first-line等。
这些以双冒号(::)开头。
css伪元素的语法如下 -
::pseudo-element{ attribute: /*value*/}
示例以下示例说明了 css 伪类和伪元素属性。
 现场演示
<!doctype html><html><head><style>a:hover{ padding: 3%; font-size:1.4em; color: tomato; background: bisque;}</style></head><body><p>you're somebody else</p><a href=#>dummy link 1</a><a href=#>dummy link 2</a></body></html>
输出这将产生以下结果 -
示例 现场演示
<!doctype html><html><head><style>p::after { content: " boom!"; background: hotpink;}p:last-child { font-size: 1.4em; color: red;}</style></head><body><p>anymore snare?</p><p>donec in semper diam. morbi sollicitudin sed eros nec elementum. praesent eget nisl vitaeneque consectetur tincidunt. ut molestie vulputate sem, nec convallis odio molestie nec.</p><p>hit</p><p>pop</p></body></html>
输出这将产生以下结果 -
以上就是css中伪类和伪元素的区别的详细内容。
其它类似信息

推荐信息