猿问

选择器searchbox设置了背景图片后背景颜色继承了父标签的背景颜色,为什么?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0;padding:0;font-size:12px;}
body{background:#F5F5F5;}
.wrap{width:1000px;margin:0 auto;}
.top{width:100%;height:27px;background:url(top_bg.jpg) repeat-x;}
.top-content{line-height:27px;margin-right:180px;}
.top-content li{float:right;width:70px;list-style-image:url(arrow.jpg);}
.top-content li a{text-decoration:none;color:#8E8E8E;}
.top-content li a:hover{color:red;}
.tel{font-family:"微软雅黑";font-size:22px;color:#C00;}
.logo{background:#FFF;height:80px;}
.leftlogo{float:left;}
.rightlogo{color:#8E8E8E;float:right;width:300px;vertical-align:middle;margin-top:35px;}
.rightlogo li{list-style-image:url(tel.jpg);}
.topbar{height:40px;background:#776E67}
.topbar li{float:left;list-style:none;line-height:40px;margin:0 20px;font-family:"微软雅黑";}
.topbar li a{color:#FFF;font-size:16px;}
.topbar-right{height:40px;}
.searchbox{background-color:#FFF;width:200px;height:28px;margin-top:4px;margin-left:80px;background:url(search.jpg) no-repeat right center;}
</style>
</head>

<body>

  <div class="top">
  	<div class="top-content">
    	<ul>
        	<li><a href="#">联系我们</a></li>
            <li><a href="#">加入收藏</a></li>
            <li><a href="#">设为主页</a></li>
        </ul>    
    </div>
  </div>
<div class="wrap">  
  <div class="logo">
  	<div class="leftlogo"><img src="logo.jpg" /></div>
    <div class="rightlogo">
    	<ul><li>24小时服务热线:<span class="tel">123-456-7890</span></li></ul>
    </div>
  </div>
  <div class="topbar">
  	<div style="width:15px;background:#776E67;height:40px;float:left;"></div>
    <div class="topbar-mid">
        <ul>
            <li><a hreg="#">首页</a></li>
            <li><a hreg="#">关于慕课</a></li>
            <li><a hreg="#">新闻动态</a></li>
            <li><a hreg="#">课程中心</a></li>
            <li><a hreg="#">在线课程</a></li>
            <li><a hreg="#">人才招聘</a></li>
        </ul>
     </div>
     <div class="topbar-right">
     	<form action method="post">
        	<input type="text" class="searchbox" />
        </form>
     </div>
  </div>
  <div class="adsarea"></div>
  <div class="content"></div>
  <div class="footer"></div>
</div>
</body>
</html>


慕粉1719112612
浏览 1053回答 1
1回答

自由的气息

默认继承父标签的背景颜色,你也可以重新定义。
随时随地看视频慕课网APP
我要回答