当前位置: 网站建设 > 网页设计 > 建站经验 >

CSS3实现改变默认文本选中的颜色

时间:2013-03-02 03:43来源:未知 作者:admin 点击:

标签:CSS3实现改变默认文本选中的颜色 颜色(9)实现(100)默认(15)CSS3(90)改变(4)Fire(1)文本(13)中的(55)目前(3)
目前Firefox、Safari、Chrome以及Opera浏览器都支持文本取舍属性,假如浏览器不支撑该属性,会直接疏忽它,所以不会发生任何不良的影响。 同样的,你能够依据本人的须要,指定CSS抉择器以及对应内容文字/图片等的选中款式,这里就不逐一举例了。 三、结语 --
CSS3实现改变默认文本选中的颜色》文章地址:http://www.tfxk.com/wangyesheji/jianzhanjingyan/0302332312013.htm

目前Firefox、Safari、Chrome以及Opera浏览器都支持文本取舍属性,假如浏览器不支撑该属性,会直接疏忽它,所以不会发生任何不良的影响。

同样的,你能够依据本人的须要,指定CSS抉择器以及对应内容文字/图片等的选中款式,这里就不逐一举例了。

三、结语 --> [网站建设之]CSS3实现转变默认文本选中的颜色

个别情形下在网页里的文本我们用鼠标选中的时候都是蓝色的,CSS3实现对话气泡效果,这个默认颜色也是可以更改的,本文我们学习如何应用CSS3实现改变默认文本选中的颜色? 对于浏览器文字选中颜色

::selection { background:#d3d3d3; color:#555; } ::-moz-selection { background:#d3d3d3; color:#555; } ::-webkit-selection { background:#d3d3d3,CSS3实现Chrome浏览器的新LOGO; color:#555; }

于是,文本选中的默认蓝色背景就此变成了淡灰色,如下图所示,截自Chrome浏览器:
 

二、改变默认选中颜色

以我的体系举例(xp 默认主题),阅读器上页面文字选中后默认的背风景是一种蓝色, 不同浏览器的颜色有些许差别,CSS3实战 尽情的实现网页圆角效果,但大抵雷同,文字色彩也近乎白色,如下图所示,截自Firefox3.6浏览器:
 

当然,我们可以使用CSS挑选器指定特定标签内容文字选中后的样式状况,CSS3实例资源收集 11个CSS3开发实用工具,例如下面所展现的栗色选中状态:

.maroon::selection { background:maroon; color:#fff; } .maroon::-moz-selection { background:maroon; color:#fff; } .maroon::-webkit-selection { background:maroon; color:#fff; }

<p class="maroon">...文字内容。</p>

会得到相似下图的后果:
 

下面就简单展示下这个改进UI休会的小技能。

首先,简略点的例子,咱们可以设置全部页面文本选中的基础样式,如下:

本文只是一个技巧交换,实际工作中是否使用还得看详细情况,在贸易网站中我是毫不会使用:selection来改变文本选中的样式的,CSS3实例教程 盒模型添加阴影属性box-shadow,要是个人网站或是设计类网站倒是很有可能使用此属性来让网站蓬荜生辉,CSS3实例教程 探索cal()功能。当然,每个人在页面重构的进程中所重视的处所时不一样的,所以,对:selection的立场仅代表个人观点。

在CSS3的爸爸妈妈还不相亲意识的时候,要改变页面上文字选中后的背景色以及文字颜色,CSS3实例教程 使用border-radius制作文本文档图标,就跟让太监生孩子一样艰苦。但是,CSS3实例教程 transitions测试学习,跟着CSS3呱呱落地,取得越来越多的浏览器认可,CSS3实例教程 box-shadow阴影和表格阴影,所有又显得那么天然而然。固然有些固执的糟老头(如IE浏览器)还不认可这个新生的CSS3,然而,丝绝不影响其在其余浏览器上对UI的又一次改良,CSS3实例学习教程 data类型的Url

Tag:CSS3   文本   颜色   CSS3   文本   颜色  
(责任编辑:网站建设)
CSS3实现改变默认文本选中的颜色相关文章
上一篇:CSS3实现对话气泡效果 下一篇:css3对于background的调整与增强
回到顶部