当我们用鼠标选中一段文字的时候我们会发现文字的颜色和背景色都改变了,

有时候设计给这种选中状态设计了其他的样式,那么我们怎么来自定义选中的文本的样式呢?

用::selection

<p>我是一段文字,当我被选中时我是默认样式</p>
<p>我是一段文字,当我被选中时我是自定义的样式</p>
p:nth-of-type(2)::selection{
background-color: #FFAAAA;
color: #5F9EA0;
}

这是效果:

伪元素::selection(怎么修改网页中被选中文本的样式)的更多相关文章

  1. 使用css3伪元素制作时间轴并且实现鼠标选中高亮效果

    利用css3来制作时间轴的知识要点:伪元素,以及如何在伪元素上添加锚伪类 1)::before 在元素之前添加内容. 2)::after 在元素之后添加内容. 提示:亦可写成 :before :aft ...

  2. js实现自定义修改网页中表格信息

    项目中的打印页面,为提高用户体验,需要增自定修改表格内容的功能,以下是使用示意图(双击td标签部分的内容,可自定义修改): 以下是js插件源码,存为edit.js文件: var tbl, tbt; v ...

  3. 修改 input中的placeholder的字体样式和颜色

    placeholder属性是css3中新增加的属性, 由于是新加入的属性因此对各大浏览器都不兼容: 因此在使用的时候要加兼容性 火狐:-moz-placeholder { /* Mozilla Fir ...

  4. selection伪元素小解

    上一篇:<RGBA与Opacity区别小解> p{font-size:14px;} 今天说一个简单的伪元素::selection,它的用武之地仅在于改变选中文本时文本的颜色和文本背景颜色. ...

  5. 使用原生js来控制、修改CSS伪元素的方法总汇, 例如:before和:after

    在网页中,如果需要使用辅助性/装饰性的内容的时候,我们不应该直接写在HTML中,这样会影响真正的内容,这就需要使用伪元素了,这是由于css的纯粹语义化是没有意义的.在使用伪元素的时候,会发现js并不真 ...

  6. 伪元素选择器,选择器优先级,CSS修改文字属性,CSS修改字体属性,CSS修改其他属性

    伪元素选择器 未使用元素选择器的效果 第一行:伪元素选择器:选择部分内容 第二行:伪元素选择器:选择部分内容 伪元素选择器:选择部分内容 伪元素选择器:选择部分内容 ::selection:选择指定元 ...

  7. CSS中的伪元素选择器

    定义 伪元素选择器:就是有连续两个冒号的选择器,如::first-line::first- letter.::before 和::after E::first-letter文本的第一个单词或字(如中文 ...

  8. 深入学习css伪类和伪元素及其用法

    前言 CSS的伪类和伪元素在平时的代码中经常会出现,可是一旦别人问你,什么是伪类,什么是伪元素,可能还是不能完整的表述出来,下面我们来一探究竟. 伪类和伪元素定义 伪类用于在页面中的元素处于某个状态时 ...

  9. CSS3 01. CSS3现状、属性选择器、伪类选择器、结构伪类、伪元素选择器、颜色、文本阴影shadow、盒子模型、私有化前缀

    CSS 3 现状 兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 : CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 ...

随机推荐

  1. Tomcat 配置篇

    Tomcat 配置一.Tomcat 基本介绍 1.关键目录 a) bin 该目录包含了启动.停止和启动其他的脚本,如startup.sh.shutdown.sh等; b) conf 配置文件和一些文档 ...

  2. CSS减肥的工具–Firefox插件 CSS Usage

    首先,我们需要安装Firefox(猛击此处下载),或者确定你已经安装的版本已经高于3.1; 第二步,安装前端开发人员最普及的开发工具 Firebug: 第三步,安装CSS Usage 0.3.4.1: ...

  3. JS中面向对象的,对象理解、构造函数、原型、原型链

    6.1 理解对象 6.1.1 对象属性类型 ECMS属性有两种类型:数据属性和访问器属性 1 数据属性 [[configurable]] 表示能否通过Delete 删除属性从而从新定义属性,能否修改属 ...

  4. 配置元素customErrors

    Asp.net配置文件的配置方式,其实在MSDN里面是写得最清楚的了.可惜之前一直未曾了解到MSDN的强大. 先贴个地址:http://msdn.microsoft.com/zh-cn/library ...

  5. U盘制作Linux系统盘

    一.首先需要有一个U盘,最好能是8G及以上的 二.下载Linux的镜像文件(我这边安装的是red hat6.3) 下载路径:http://pan.baidu.com/s/1jIGYCKI 三.下载制作 ...

  6. (转)set集合的应用

    set集合的应用 python的set和其他语言类似, 是一个无序不重复元素集, 基本功能包括关系测试和消除重复元素. 集合对象还支持union(联合), intersection(交), diffe ...

  7. __m128i的理解[转]

    __m128i被称为128bits的整数,当我们对其赋值时,调用 __m128i _mm_set1_epi32(int i) Sets the four signed 32-bit integer v ...

  8. discuz论坛目录功能详解

    在某处收集来的discuz目录资料,二次开发挺有用的.记录下.(基于7.0的标准程序,部分与插件无关的文件不作说明) 文件颜色说明: 红色:程序核心文件,修改这类文件时千万要注意安全! 橙色:做插件几 ...

  9. 十进制二进制之间的转化 PHP算法

    [ 十进制转二进制 ] function test($var){ $func = function($i){ if($i < 2){ return $i; } $return['int'] = ...

  10. 小插曲之变量和字符串 - 零基础入门学习Python003

    小插曲之变量和字符串 让编程改变世界 Change the world by program 变量 (此处只是省略N多细节,详细通过视频学习) 变量名就像我们现实社会的名字,把一个值赋值给一个名字时, ...