壹 ❀ 引

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

 贰 ❀ ::selection

解决方案其实很简单,使用css3 ::selection属性,该属性用于匹配元素中被用户选中或处于高亮状态的部分,并且支持修改匹配元素的color, background, cursor,和outline属性。

我在博客设置添加了如下代码:

::selection {
color: #fff;
background: #088;
}

那么现在博客文本选中就是这个样子了:

 叁 ❀ 兼容

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

一片绿色,IE9之后完全支持,需要注意的是,火狐61之前得添加-moz-前缀,这个操作可以交给前端构建工具去做。

::-moz-selection{}

那么就记录到这里了。

CSS修改选中文本颜色与背景色的更多相关文章

  1. win32 修改Edit控件文本颜色与背景色

    #define WM_CTLCOLORMSGBOX 0x0132 #define WM_CTLCOLOREDIT 0x0133 //编辑控件Edit #define WM_CTLCOLORLISTBO ...

  2. 前端开发css禁止选中文本

    在我们日常的Java web前端开发的过程中呢,程序员们会遇到各种各样的要求,所以不每天学的东西感觉自己都退步了,都更不上时代的发展了. 每天应对各种需求,每天活在疑问中就是我们程序员的真是写照.但我 ...

  3. css 修改placeholder字体颜色字体大小 修改input记住账号密码后的默认背景色

     壹 ❀ 引 本来这个阶段的项目页面都是给实习生妹子做的,我只用写写功能接接数据,但这两天妹子要忙翻译,这个工作阶段也快结束了导致有点慌,只能自己把剩余的几个小页面给写了. 那么做页面的过程中,UI也 ...

  4. css 禁止选中文本

    css 如何禁止选中文字 .noselect { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* ...

  5. css 修改placeholder的颜色

    input::-webkit-input-placeholder { color: #ff0000; } input::-moz-input-placeholder { color: #ff0000; ...

  6. CSS 鼠标选中文字后改变背景色的实现代码

    废话不多说,直接上代码 ::-moz-selection{background:#93C; color:#FCF;} ::selection {background:#93C; color:#FCF; ...

  7. pycharm修改选中字体颜色

    File->Setting->Editor->Color Scheme->General Scheme:Monokai 在方框内: Editor->Section Bac ...

  8. 【css3】如何自定义 placeholder 文本颜色

    昨天写了一篇基于 jquery 实现 ie 浏览器兼容 placeholder 效果,具体内容点击传送门.不过还是有点小瑕疵,就是不能设置 placeholder 文本颜色.本文主要介绍利用 css ...

  9. QTextEdit中选中文本修改字体与颜色,全部文本修改字体与颜色(设置调色板的前景色、背景色、文字颜色以及基色)

    ----我的生活,我的点点滴滴!! 当然以下内容都可以通过设置样式来达到目的,但是下面不使用这样的方法 先来看张图,理解此图基本就能实现上面所要达到的目的了 Widget::Widget(QWidge ...

随机推荐

  1. pgwSlideshow.js

    <!DOCTYPE html> <html> <head id="Head"> <meta http-equiv="Conten ...

  2. SQL Server获取索引创建时间&重建时间&重组时间

    之前写过一篇博客"SQL Server中是否可以准确获取最后一次索引重建的时间?",里面主要讲述了三个问题:我们能否找到索引的创建时间?最后一次索引重建(Index Rebuild ...

  3. subprocess之check_out用法

    在python3中使用subprocess的check_out方法时,因为该输出为byte类型,所以如果要查看具体的内容时需要进行转码,如果转码不对话,会影响内容输出的可读性,如下: #1,输出解码不 ...

  4. 微信 PC HOOK

    一.概述 Web端有开源代码,但新用户登录不了 PC端也有开源代码,新老用户都能登录 市场上已有的产品:发卡机器人.多群转发机器人.营销管理机器人 基本的功能:收发消息,加人加群,收账抢红包 二.原理 ...

  5. ios 免费抓包工具Stream

    ios 免费抓包工具Streamhttps://www.52pojie.cn/thread-1002406-1-1.html

  6. LeetCode 1291. 顺次数

    地址 https://leetcode-cn.com/problems/sequential-digits/submissions/ 题目描述我们定义「顺次数」为:每一位上的数字都比前一位上的数字大 ...

  7. python访问kafka

    操作系统 : CentOS7.3.1611_x64 Python 版本 : 3.6.8 kafka 版本 : 2.3.1 本文记录python访问kafka的简单使用,是入门教程,高阶读者请直接忽略. ...

  8. windows7使用vhd虚拟磁盘

    操作系统 : windows7_x64 创建vhd 磁盘管理 --> 操作 --> 创建vhd 挂载vhd 脚本: rem 挂载VHD @echo off (echo select vdi ...

  9. router-view 与 动态组件 区别

    提问:router-view 可以页面跳转,使用 is特性 也可以进行页面跳转,有什么区别? 参考链接 https://segmentfault.com/q/1010000010750059

  10. ASP.NET MVC教程五:ASP.NET MVC中的路由

    一.概述 在ASP.NET MVC架构中,控制器在3大核心构件中处于中心地位,通过控制器支配模型和视图,然而从浏览器发出的请求到控制器还需要路由的协助,路由将特定的请求和控制器的动作对应起来. 在AS ...