HTML中的色彩叠加受到位置和深度的限制，当两个或多个
颜色叠在一起时，显示出来的颜色会发生变化，因为被叠加的颜色会有深度/位置关系，其中一种颜色可能会比另一种覆盖得更深，这样在视觉上就会显示出另一种颜色。问题详述： 当设置块级元素div颜色为粉色，页面背景颜色为白色时，div子元素比如<p>段落内容在浏览器界面没有显示出父元素div的粉色，而显现出了页面背景的白色。（如图1） 事发现场： <!doctype html> <html lang="zh-cn"> <head> <title>颜色覆盖问题还原</title> <meta charset="utf-8"> <style> *{ background-color:white } div{ background-color:pink } </style> </head> <body> <div>天呐
我是一整段 <p>我是
一段话</p> <p>我是一段话</p> <p>我是一段话</p> <p>我是一段话</p> </div> </body> </html> 问题解决方法： 简单 (:зゝ∠)把*{}改成body{}，还我粉色世界！ 问题参考链接: 和我的问题一样 http://bbs.51cto.com/thread-1151863-1-1.html这个问题更深一点 http://bbs.csdn.net/topics/380241918是不是很简单，是不是很炫酷，是不是觉得自己傻缺的可爱......
参考代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
/*没被访问过之前*/
a:link{
color: blue
}
/*默认*/
a{
color: red
}
/*鼠标掠过*/
a:hover{
color: green
}
/*访问过后*/
/*一般不设置visited*/
/*a:visited{*/
/*color: black*/
/*}*/
</style>
</head>
<body>
<a href="#">颜色</a>
</body>
</html>
效果：
一开始是蓝色的，因为link是没有被点击之前的颜色，他会覆盖默认颜色。
鼠标移上去是绿色
点击访问之后是红色。
如果你把visited加上去你会发现点完之后是visited所设置的颜色而不是默认颜色，visited也就是访问过之后的颜色。
微信扫一扫
支付宝扫一扫
评论列表（0条）