Maison >interface Web >tutoriel CSS >Introduction à la façon dont CSS embellit le texte sélectionné

Introduction à la façon dont CSS embellit le texte sélectionné

高洛峰
高洛峰original
2017-03-08 15:20:191575parcourir

Le rôle du CSS est d'embellir le contenu ou la hiérarchie structurelle des pages Web. Nous le savons tous, n'est-ce pas ? Grâce à l'innovation et à la mise à niveau continues de la technologie CSS, nous avons acquis une plus grande capacité à contrôler les styles. Une technique peu connue consiste à embellir le style du texte sélectionné dans le navigateur. Windows lui-même offre une vilaine couleur vert foncé, tandis que les ordinateurs Apple offrent une couleur vert clair. Firefox, IE9, Opera et Google Chrome nous permettent de personnaliser la couleur du texte sélectionné. Laissez-moi vous montrer :

Code CSS

/* webkit, opera, IE9 */
::selection { background:lightblue; }   
/* mozilla firefox */
::-moz-selection { background:lightblue; }

-moz-property le préfixe est pour Firefox, et le sélecteur de sélection de base :: est destiné à Google pour une utilisation dans le navigateur. Comme les autres sélecteurs CSS, vous pouvez les imbriquer pour afficher différentes couleurs à différents endroits :

/* webkit, opera, IE9 */
p.highlightBlue::selection { background:lightblue; }   
/* mozilla firefox */
p.highlightBlue::-moz-selection { background:lightblue; }   

/* webkit, opera, IE9 */
p.highlightPink::selection { background:pink; }   
/* mozilla firefox */
p.highlightPink::-moz-selection { background:pink; }

Embellir le texte sélectionné avec CSS n'est qu'une technique très simple, mais celles-ci peuvent rendre les pages de votre site Web plus magnifique et coloré !

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'apprentissage de chacun. J'espère également que tout le monde soutiendra le site Web PHP chinois.



Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn