网站上的文本样式是网页设计和开发的一个重要方面。为此，CSS（层叠样式表）是一个可供您使用的强大工具。 CSS 是一种多功能工具，允许以各种方式操纵文本的外观。最受追捧的技术之一是更改所选文本的颜色。在本文中，我们将学习两种使用 CSS 更改所选文本颜色的技术。

::选择伪元素

::selection 伪元素是一个强大的功能，使我们能够选择用户当前突出显示的文本并为其设置样式。要更改所选文本的颜色，我们使用 color 属性。例如，如果我们想让所选文本显示为栗色，我们将使用以下 CSS -

::selection {
   color: red;
} 

这会将整个网页的所选文本颜色更改为红色。

示例

以下示例将所选文本的颜色更改为红色，背景颜色更改为黑色。

立即学习“前端免费学习笔记（深入）”；

   
   


   
Changing the color of selected text using CSS
   
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
   Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an 
   unknown printer took a galley of type and scrambled it to make a type specimen book.
   It has survived not only five centuries, but also the leap into electronic typesetting

通过使用特定元素或类

我们可以更改特定元素或类上选定文本的颜色和背景颜色。例如，我们可以使用以下 CSS 更改特定“h1”标签内选定文本的颜色 -

网奇IOS智能在线订单系统

产品简介： 网奇IOS智能订单系统，是网奇公司研发的一款智能在线订单编辑以及管理系统。本系统适合使用在；在线报名、酒店预定、信息反馈、在线订单和在线投诉等等诸多应用上。本系统所有选项字段完全通过后台控制，在线报名系统可以变为在线预定系统，同时可以变为任何其它的系统，里面的栏目字段，可以任意添加、删除、 修改。本系统为网奇公司全国独家首创，顺应网络需求，安装十分便利，上传即可使用。产品特色：

下载

h1::selection {
   background: red;
   color: white;
}

这会将 h1 元素中选定文本的颜色更改为白色，并将选定文本的背景颜色更改为红色。

示例

以下示例将选定的

文本颜色更改为白色，背景颜色更改为红色，

文本更改为红色，背景更改为黄色，

文本更改为蓝色，背景颜色更改为粉色。

   
   


   
Welcome to tutorialsPoint
   
Change the color of selected text using CSS
   
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
   Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown 
   printer took a galley of type and scrambled it to make a type specimen book. It has survived 
   not only five centuries, but also the leap into electronic typesetting

结论

使用 CSS 更改所选文本的颜色是一项简单的任务，可以通过利用 ::selection 伪元素来完成。通过使用颜色和背景颜色属性，我们可以更改网站上所选文本的外观。此外，我们可以在特定元素或类上使用 ::selection 伪元素，以更精确地控制所选文本的样式。