css背景颜色hover变深

2024-10-03

巧用hover改变css样式和背景

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="jquery-3.2.1.js"></script> <style> .bg{ background-color: #9b9b9b; } .tu{

CSS背景颜色设置 background-color:red;如设置背景颜色为红色: 背景颜色设置支持3种写法: 颜色名 16进制 rgb CSS背景图片颜色设置 background-image:url(图片地址);如设置背景图片路径不在说明了! CSS背景图片平铺设置(如果不设置图片默认设置为x轴y轴同时平铺即值为repeat) background-repeat:repeat-x;如设置x轴平铺: background-repeat:no-repeat如设置不平铺: CSS背景图片定位设

利用CSS背景颜色属性使父级div背景透明同时避免子级标签透明。

实现背景色透明效果的代码实现各个浏览器中具备良好的透明特性的效果,IE中使用私有滤镜filter,高端浏览器使用CSS3中的rgba属性. 输入十六进制的颜色值以及透明度,自动在IE的过渡滤镜以及CSS3中的rgba属性之间进行十六进制与十进制的换算. 增加对IE9浏览器中的滤镜取消效果 ★ 鉴于需要做浏览器的hack,使用了:root来让IE9以前的浏览器不支持效果,所以增加了一个需要添加选择符类名的方式,对于这块需要大家在后期添加样式到代码中做单独的处理把CSS代码中的backgroun

CSS 背景颜色

颜色背景 CSS中背景颜色由background-color决定,这里的背景颜色会渲染padding和content,不会渲染border和margin部分. 在css3中可以通过background-clip来定义颜色的渲染区域:取值为content-box(仅渲染content部分),padding-box(渲染content和padding部分)和border-box(渲染content.padding): 测试过程发现padding-box和border-box渲染效果一样,不知为何有这

css背景颜色、背景图片，以及列表的多种样式

背景样式 • background-color 设置元素的背景颜色.• background-image 把图像设置为背景.• background-position 设置背景图像的起始位置.• background-attachment 背景图像是否固定或者随着页面的其余部分滚动.• background-repeat 设置背景图像是否重复及如何重复.• background 简写属性,作用是将背景属性设置在一个声明中. 列表样式 • list-style-type 设置列表项标志的类型.•

一个CSS背景颜色问题

div{ background: rgba(0,0,0,.1); background-color: #19FFFFFF; } 安卓下会显示上面的透明颜色,而在iOS上则显示下面的颜色,并且其中的颜色值错误同样有效.

css背景颜色渐变

1.效果 2.代码 /* 基本色 */ background: #3FB0AC; /* chrome 2+, safari 4+; multiple color stops */ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(1, #3FB0AC), color-stop(1, #C5D7A1)); /* chrome 10+, safari 5.1+ */ background-image

CSS背景颜色透明

{ filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; } 兼容大部分主流浏览器 filter:alpha(opacity=50); 在IE里面是相当于脚本的存在

CSS 背景-CSS background

这里有个很好的样式学习网站:http://www.divcss5.com/rumen/r125.shtml 一.Css background背景语法 - TOP CSS背景基础知识 CSS 背景这里指通过CSS对对象设置背景属性,如通过CSS设置背景各种样式. 背景语法: background: background-color || background-image || background-repeat || background-attachment || background-

CSS背景background图片

一.CSS背景background图片 - TOP 1.背景图片语法background-image:url() 引入背景图片background-repeat:no-repeat 设置背景图片是否重复平铺background-position:left top 设置图片的css背景定位,left代表靠左,top代表靠上简写背景图片语法:background:url(图片地址) no-repeat left top 2.背景图片设置Body{background:url(http://

CSS 背景background实例

css背景background用于设置html标签元素的背景颜色.背景图片已经其他背景属性.本文章向码农介绍CSS 背景background使用方法和基本的使用实例.需要的码农可以参考一下. 一.Css background背景语法 CSS背景基础知识 CSS 背景这里指通过CSS对对象设置背景属性,如通过CSS设置背景各种样式. 背景语法: background: background-color || background-image || background-repeat || back

css3实现背景颜色渐变，文字颜色渐变，边框颜色渐变

css3的渐变可以使用2个或者多个指定的颜色之间显示平稳的过渡的效果.这篇文章主要介绍下css3实现背景颜色渐变,文字颜色渐变,边框颜色渐变的方法,以便大家学习参考! 1.css背景颜色渐变代码: <style> .content_bg{ width:600px;max-width: 100%;margin: auto; height:150px; line-height:150px; text-align:center; font-size:32px;color:#fff; backgro

CSS实例：鼠标滑过超级链接文字时改变背景颜色

先讲简单的: 通过CSS可以设置超链接在不同时刻的颜色: <style> a:link {color: #FF0000} /* 未访问的链接 */ a:visited {color: #00FFFF} /* 已访问的链接 */ a:hover {color: #0000FF} /* 鼠标移动到链接上 */ a:active {color: #00FF00} /* 选定的链接 */ </style> <ul id="content"> <li&g

兼容性背景颜色半透明CSS代码（不影响内部子元素）

如何简单兼容性的实现父元素是半透明背景色,而子元素不受影响. 兼容所有浏览器的背景颜色半透明CSS代码: background-color: rgba(, , , .); filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#,endColorStr=#); 注意:startColorStr 和 endColorStr 的值,前两位是十六进制的透明度,后面六位是十六进制的颜色. 其格式为 #AARRGGBB . AA

div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法（借鉴）

原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度,在IE浏览器下显示正常.但是使用Firefox/opera浏览时却出现最外层Div的背景颜色和边框不起作用的问题. 大体结构 <div class="outer"> <div class="inner1"></div> <d

【IE6的疯狂之八】链接伪类（:hover）CSS背景图片有闪动BUG

IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存. 例如: CSS代码 a:hover{background:url(imagepath)} 常用的解决方案: 在页面底部添加以下IE6专用代码,让IE6缓存CSS背景图片至本地,这样a:hover时IE6就不会再重新向服务器请求加载背景图片了. XML/HTML代码 <!–[if IE 6]> <script type=”text/javascript”> docume

【转】链接伪类（:hover）CSS背景图片有闪动BUG

来源:http://www.css88.com/archives/744 ------------------------------------------------------------------------------------------------- IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存. 例如: CSS代码 a:hover{background:url(imagepath)} 常用的解决方案: 在页面

css取消a标签在移动端点击时的背景颜色

一.取消a标签在移动端点击时的蓝色 -webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-user-select: none;-moz-user-focus: none;-moz-user-select: none; 二.使用图片作为a标签的点击按钮时,当触发touchstart的时候,往往会有一个灰色的背景 a,a:hover,a:active,a:visited,a:link,a:focus{ -webkit-tap-h

CSS 之动态变换背景颜色

先上效果图 HTML代码: 123456789 <div class="header"> <h1>GCCHRN'S BLOG</h1> <ul class="nav nav-tabs"> <li role="presentation" class="active"><a href="#">首页</a></li>

神奇的 CSS，让文字智能适配背景颜色

最近几天,有好几个同学都问了同样一个问题. 页面上有一段文本,能否实现这段文本在不同背景色下展示不同的颜色?也就是俗称的智能变色.像是下面这样: 文本在黑色底色上表现为白色,在白色底色上表现为黑色.看似很复杂的一个效果,但是其实在 CSS 中非常好实现,今天就介绍这样一个小技巧,在 CSS 中,利用混合模式 mix-blend-mode: difference,让文字智能适配背景颜色. 混合模式 mix-blend-mode: difference CSS3 新增了一个很有意思的属性 -- mi

背景颜色 - bootStrap4常用CSS笔记

.bg-primary 重要的背景颜色 .bg-success 执行成功背景颜色 .bg-info 信息提示背景颜色 .bg-warning 警告背景颜色 .bg-danger 危险背景颜色 .bg-secondary 副标题背景颜色 .bg-dark 深灰背景颜色 .bg-light 浅灰背景颜色