CSS修改选中文本颜色与背景色
壹 ❀ 引
在做博客美化的时候,想着去修改文本选中的背景色,因为网页默认是蓝底白字,看着与自己博客整体配色不太搭配,所以想着去改改。

贰 ❀ ::selection
解决方案其实很简单,使用css3 ::selection属性,该属性用于匹配元素中被用户选中或处于高亮状态的部分,并且支持修改匹配元素的color, background, cursor,和outline属性。
我在博客设置添加了如下代码:
::selection {
color: #fff;
background: #088;
}
那么现在博客文本选中就是这个样子了:

叁 ❀ 兼容
由于是css3属性,所以简单看下PC端浏览器兼容性:

一片绿色,IE9之后完全支持,需要注意的是,火狐61之前得添加-moz-前缀,这个操作可以交给前端构建工具去做。
::-moz-selection{}
那么就记录到这里了。
CSS修改选中文本颜色与背景色的更多相关文章
- win32 修改Edit控件文本颜色与背景色
#define WM_CTLCOLORMSGBOX 0x0132 #define WM_CTLCOLOREDIT 0x0133 //编辑控件Edit #define WM_CTLCOLORLISTBO ...
- 前端开发css禁止选中文本
在我们日常的Java web前端开发的过程中呢,程序员们会遇到各种各样的要求,所以不每天学的东西感觉自己都退步了,都更不上时代的发展了. 每天应对各种需求,每天活在疑问中就是我们程序员的真是写照.但我 ...
- css 修改placeholder字体颜色字体大小 修改input记住账号密码后的默认背景色
壹 ❀ 引 本来这个阶段的项目页面都是给实习生妹子做的,我只用写写功能接接数据,但这两天妹子要忙翻译,这个工作阶段也快结束了导致有点慌,只能自己把剩余的几个小页面给写了. 那么做页面的过程中,UI也 ...
- css 禁止选中文本
css 如何禁止选中文字 .noselect { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* ...
- css 修改placeholder的颜色
input::-webkit-input-placeholder { color: #ff0000; } input::-moz-input-placeholder { color: #ff0000; ...
- CSS 鼠标选中文字后改变背景色的实现代码
废话不多说,直接上代码 ::-moz-selection{background:#93C; color:#FCF;} ::selection {background:#93C; color:#FCF; ...
- pycharm修改选中字体颜色
File->Setting->Editor->Color Scheme->General Scheme:Monokai 在方框内: Editor->Section Bac ...
- 【css3】如何自定义 placeholder 文本颜色
昨天写了一篇基于 jquery 实现 ie 浏览器兼容 placeholder 效果,具体内容点击传送门.不过还是有点小瑕疵,就是不能设置 placeholder 文本颜色.本文主要介绍利用 css ...
- QTextEdit中选中文本修改字体与颜色,全部文本修改字体与颜色(设置调色板的前景色、背景色、文字颜色以及基色)
----我的生活,我的点点滴滴!! 当然以下内容都可以通过设置样式来达到目的,但是下面不使用这样的方法 先来看张图,理解此图基本就能实现上面所要达到的目的了 Widget::Widget(QWidge ...
随机推荐
- 解决测试redis集群时报"java.lang.NumberFormatException: For input string: "7003@17003..7002@17002"等异常
一.前言 关于redis5.0的集群模式下,通过客户端测试代码调试报"Exception in thread "main" java.lang.NumberFormatE ...
- 导入Jar报错An internal error occurred during: "Building workspace". zip END header not found
百度了好久都没有找到答案,后来新建了一个文件夹,再build path就正常了,不知道为什么
- 淘宝爬取图片和url
刚开始爬取了 百度图片和搜狗图片 但是图片不是很多,随后继续爬取淘宝图片,但是淘宝反爬比较厉害 之前的方法不能用 记录可行的 淘宝爬取 利用selenium爬取 https://cloud.tence ...
- C语言程序设计100例之(15):除法算式
例15 除法算式 问题描述 输入正整数n(2≤n≤68),按从小到大输出所有形如abcde/fghi=n的表达式.其中a~i为1~9的一个排列. 输入格式 每行为一个正整数n (n <= 1 ...
- 体感在js中的调用
体感技术,在于人们可以很直接地使用肢体动作,与周边的装置或环境互动,而无需使用任何复杂的控制设备,便可让人们身临其境地与内容做互动. 体感分为三大类: 惯性感测:主要是以惯性传感器为主,例如用重力传感 ...
- php中Session使用方法详解
Session的声明与使用 Session的设置不同于Cookie,必须先启动,在PHP中必须调用session_start().session_start()函数的语法格式如下: Bool sess ...
- 你可能会忽略的 Git 提交规范
一.为什么需要规范? 无规矩不成方圆,编程也一样. 如果你有一个项目,从始至终都是自己写,那么你想怎么写都可以,没有人可以干预你.可是如果在团队协作中,大家都张扬个性,那么代码将会是一团糟,好好的项目 ...
- Centos 7 下安装 Jenkins
Jenkins介绍 Jenkins是一个开源的支持自动化构建.部署等任务的平台.基本上可以说是持续集成(CI).持续发布(CD)不可或缺的工具. 安装Java环境 CentOS 7 安装 JAVA环境 ...
- Jupyter Notebook 使用小记
简介 Jupyter Notebook 是一款几乎综合所有编程语言,能够把软件代码.计算输出.解释文档.多媒体资源整合在一起的多功能科学计算平台.具有如下优点: 整合所有资源 交互性编程体验 零成本重 ...
- 关于vue-detools chorme创建安装完成,但是控制台不显示问题
搜了一下发现挺多人遇到这个问题的,绝大多数的回答都是在main.js中添加下面代码 Vue.config.devtools = true; 但是发现并不行. 后来看到有人说刷新然后在按F12就好了,居 ...