您的位置:首页 > 其它

改变文字选中时背景颜色

2017-05-10 21:26 169 查看
在线演示



html:

<body>
<h1>Woman</h1>
<p>Every woman is ... You are worth it! </p>
</body>


css:

<style>
body {
background:url(images/09.png) no-repeat 50% 0;
margin: 10% 20%;
color: #fff;
text-shadow: 1px 2px 0 rgba(0,0,0,.75);
background-attachment: fixed;/* 背景图片固定,不随文字的滚动而滚动 */
}
h1 {
text-transform: uppercase; /*英文字母全部大写*/
border-bottom: 2px solid #fff;
padding-bottom: 50px;
}
p {
font-size: 20px;
}
::selection {  /*设置选中区域文字背景变化*/
text-shadow: none;
color: #fff;
background-color: #e74c3c;/*为选中文字设置背景颜色*/
}
</style>


解析:

通过selection伪元素来实现反选样式。

只能向::selection应用少量的CSS属性,如color、background、cursor、及outline等。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: