霍者博客

CSS3选择器-状态性伪类选择器(五)::selection伪类选择器

今天我们来学习一下selection伪类选择器,不是select下拉列表。

::selection选择器:

此选择器使用了两个“:”不是笔误,它的标准写法就是这样;作用主要是用来指定元素处于选中状态时的样式,案例如下:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312">
<title>CSS3选择器-状态性伪类选择器(五)::selection伪类选择器 | 霍者博客(huozheweb.com)!</title>
<style type="text/css">
    *{margin:0; padding:0;}
    body{margin-bottom:20px; font-size:14px;}
    p{height:30px; line-height:30px; font-family:"Microsoft Yahei";}
    p::selection{color:#fff; background:#900;}/*当文字选中时,背景红色,字体颜色为白色*/
</style>
</head>
    
<body>
    <p>霍者博客(huozheweb.com)!</p>
    <p>霍者博客,关注网页设计和网页技术的前沿信息的自媒体博客</p>
    <p>CSS3选择器-状态性伪类选择器(五)::selection伪类选择器 | 霍者博客(huozheweb.com)!</p>
</body>
</html>

原创文章请注明转载自霍者博客本文地址:http://www.huozheweb.com/post/580.html,标题:CSS3选择器-状态性伪类选择器(五)::selection伪类选择器

【我来说两句】
分享到:

评论 0

发表评论:

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