<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
????<meta?charset="utf-8">
<title>網(wǎng)頁(yè)定位導(dǎo)航</title>
<style>
*?{?margin:?0;padding:?0;?}
ul{list-style:?none;}
a{text-decoration:?none};
#content?{
width:?800px;
margin:?0?auto;
padding:?20px;
}
????#content?h3{
???? color:?#1f1f1f;
????}
????#content?.item?{
???? padding:?20px;
???? border:1px?dotted?#0088bb;
????}
????#content?.item?h4?{
???? font-size:?16px;
???? border-bottom:?2px?solid?#08b;
???? margin-bottom:?10px;
????}
????#content?.item?li?{
???? display:?inline;
???? margin-right:?16px;
????}
????#content?.item?li?a?img?{
???? width:?230px;
???? height:230px;
????}
</style>
</head>
<body>
<div>
????<ul>
????<li><a?href="#">1F?男裝</a></li>
????<li><a?href="#">2F?女裝</a></li>
????<li><a?href="#">3F?美妝</a></li>
????<li><a?href="#">4F?數(shù)碼</a></li>
????<li><a?href="#">5F?母嬰</a></li>
????</ul>
</div>
<div?id="content">
????<h3>天貓購(gòu)物商城</h3>
<div?id="item1"?class="item">
<h4>1F?男裝</h4>
<ul>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
<li><a?href="#"><img?src="./img/1F.jpg"?alt="1F"></a></li>
</ul>
</div>
<div?id="item2"?class="item">
<h4>2F?女裝</h4>
<ul>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
<li><a?href="#"><img?src="./img/2F.jpg"?alt="2F"></a></li>
</ul>
</div>
<div?id="item3"?class="item">
<h4>3F?美妝</h4>
<ul>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
<li><a?href="#"><img?src="./img/3F.jpg"?alt="3F"></a></li>
</ul>
</div>
<div?id="item4"?class="item">
<h4>4F?數(shù)碼</h4>
<ul>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
<li><a?href="#"><img?src="./img/4F.png"?alt="4F"></a></li>
</ul>
</div>
<div?id="item5"?class="item">
<h4>5F?母嬰</h4>
<ul>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="5F"></a></li>
<li><a?href="#"><img?src="./img/5F.jpg"?alt="1F"></a></li>
</ul>
</div>
</div>
</body>
</html>
2016-07-31
你的寬度沒(méi)起作用，所以就居中不了。
2016-06-07
?*?{?margin:?0;padding:?0;?}
????ul{list-style:?none;}
????a{text-decoration:?none};?? //你這里多寫(xiě)了一個(gè) ; 號(hào)。代表結(jié)束。后邊的不執(zhí)行咯