h1 和 h2 为什么会自动加有下划线？求教
qq_轮滑到老_04284587
2018-08-05 09:59
<!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>
*{margin:0; padding:0;}
body{font-size:12px; line-height:1.7;}
li{list-style:none;}
#content{width:800px; margin:0 auto; padding:20px;}
#content h1{color:#0088bb;}
#content .item{padding:20px; margin-bottom:20px; border:1px dotted #0088bb;}
#content .item h2{font-size:16px; font-weight:bold; border-bottom:2px solid #0088bb; margin-bottom:10px;}
</style>
</head>
<body>
<div id="menu">
<ul>
<li><a href="#">1F 男装</li>
<li><a href="#">2F 女装</li>
<li><a href="#">3F 美妆</li>
<li><a href="#">4F 数码</li>
<li><a href="#">5F 母婴</li>
</ul>
</div>
<div id="content">
<h1>地狗购物网</h1>
<div id="item1" class="item">
<h2>1F 男装</h2>
<ul>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
<li><a href="#"><img src="1F.jpg" alt="" /></a></li>
</ul>
</div>
<div id="item2" class="item">
<h2>2F 女装</h2>
<ul>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
<li><a href="#"><img src="2F.jpg" alt="" /></a></li>
</ul>
</div>
<div id="item3" class="item">
<h2>3F 美装</h2>
<ul>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
<li><a href="#"><img src="3F.jpg" alt="" /></a></li>
</ul>
</div>
<div id="item4" class="item">
<h2>4F 数码</h2>
<ul>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
<li><a href="#"><img src="4F.png" alt="" /></a></li>
</ul>
</div>
<div id="item5" class="item">
<h2>5F 母婴</h2>
<ul>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
<li><a href="#"><img src="5F.jpg" alt="" /></a></li>
</ul>
</div>
</div>
</body>
</html>
2回答
-
- qq_慕盖茨8361330
- 2019-01-15 22:58:40
你a标签没闭合 导航里面的 <a> 没有</a>
-
- 读东读西
- 2018-08-05 23:21:02
border-bottom
网页定位导航特效
71394 学习 · 489 问题
相似问题