如何改变网页反白颜色? ( ::selection详解 )

::selection可以改变整个网页的反白顏色,如果在::selection加上标籤名称,就代表只会生效在该标籤内,如p::selection,代表只套用在<p></p>中。

p::selection {
    background: #FA60F1;
    color: #fff;
}
i::selection {
    background: #01DD1B;
    color: #fff;
}
::selection {
    background: #000;
    color: #fff;
}
p::-moz-selection {
    background: #FA60F1;
    color: #fff;
}
i::-moz-selection {
    background: #01DD1B;
    color: #fff;
}
::-moz-selection {
    background: #000;
    color: #fff;
}

由于Firefox瀏览器对於::selection是不支持的,所以要用Firefox专属语法才能达成效果
 
「::-moz-selection」。

另外,::selection只能针对背景顏色(background)及文字顏色(color)下去做设定,如果在其中加入其他的样式,如font-size:25px;这样,是不会生效的(背景图片也不会生效)。假设我们有这一段样式:

::selection {
    background: #FE2AFC;
    color: #fff;
    font-size: 25px;
}
::-moz-selection {
    background: #FE2AFC;
    color: #fff;
    font-size: 25px;
}

发表评论

邮箱地址不会被公开。 必填项已用*标注