Home > Web Front-end > CSS Tutorial > How to use the selection selector? Detailed explanation of the usage of selection selector

How to use the selection selector? Detailed explanation of the usage of selection selector

云罗郡主
Release: 2018-11-21 16:47:56
forward
4185 people have browsed it

This article brings you how to use the selection selector? A detailed explanation of the usage of the selection selector has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

By default, the webpage text selected with the mouse in the browser is displayed with "dark blue background, white font". But sometimes we don't want the display effect of "dark blue background, white fonts".

How to use the selection selector? Detailed explanation of the usage of selection selector

::selection selector

Default style when the browser selects text

In CSS3, we can use "::selection Selector" to change the display of selected web page text.

Note that "::selection selector" is a double colon. In fact, double colons are often "pseudo elements", while single colons are often "pseudo classes".

The code is as follows:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
    <title>CSS3 ::selection选择器</title>
    <style type="text/css">
        div::selection
        {
            background-color:red;
            color:white;
        }
        p::selection
        {
            background-color:orange;
            color:white;
        }
    </style>
</head>
<body>
    <div>php中文网,让学习成为一种习惯</div>
    <p>php中文网,让学习成为一种习惯</p>
</body>
Copy after login

The effect is as follows:

How to use the selection selector? Detailed explanation of the usage of selection selector

How to use the selection selector? Detailed explanation of the usage of selection selector

##The above is how to select the selection selector use? A complete introduction to the detailed usage of the selection selector. If you want to know more about

CSS3 tutorial, please pay attention to the PHP Chinese website.


The above is the detailed content of How to use the selection selector? Detailed explanation of the usage of selection selector. For more information, please follow other related articles on the PHP Chinese website!

source:lvyestudy.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template