为什么背景颜色会覆盖元素中的图片?
<!DOCTYPE html> <html> <head> <title>导航条绝对居中</title> <meta charset="utf-8"> <style type="text/css"> body,div,ul,li { margin: 0;padding: 0; } .nav { width: 1200px;height: 120px; position: absolute;top: 0;bottom: 0;left: 0;right: 0; margin: auto; background: #000; color: #fff; font: 30px "Microsoft YaHei"; } .nav-logo {float: left;} .nav-list {float: right;} .nav-list ul li { list-style-type: none; display: inline; line-height: 120px; margin: 0 50px 0 20px; } </style> </head> <body> <div class="nav"> <div class="nav-logo"> <img src="http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png"> </div> <div class="nav-list"> <ul> <li>课程</li> <li>职业路径</li> <li>实战</li> <li>猿问</li> <li>手记</li> </ul> </div> </div> </body> </html>
logo 被黑色背景覆盖了。这是什么原因呢?
7
收起
正在回答
2回答
背景颜色没有覆盖图片,因为图片区域除了红色标志和文字以外,其余的地方均是透明的,所以才会显示出黑色的背景颜色。
祝学习愉快!
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星