<!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>
<link href="css/main1.css" type="text/css" rel="stylesheet" />
<script src="js/myfocus-2.0.1.min.js" type="text/jscript" ></script>
<script src="js/mf-pattern/mF_fancy.js" type="text/jscript"></script>
<link href="js/mf-pattern/mF_fancy.css" type="text/css" rel="stylesheet" />
<script type="text/jscript">
myFocus.set({id:'picBox'})
</script>
</head>
<body>
<div class="wrap">
<div class="top">
<img src="img/logo.jpg" alt="慕课网"/>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">产品特色</a></li>
<li><a href="#">解决方案</a></li>
<li><a href="#">产品价格</a></li>
<li><a href="#">帮助中心</a></li>
<li><a href="#">关于我们</a></li>
</ul>
</div><!--头部-->
<div class="ad" id="picBox">
<div><img src="img/loading.gif" alt="加载中" /></div>
<div class="pic">
<ul>
<li><img src="img/ad2.jpg" /></li>
<li><img src="img/ad3.jpg" /></li>
<li><img src="img/ad4.jpg" /></li>
</ul>
</div>
</div>
</div>
</body>
</html>
你可以试试绝对居中
css 有两种居中方法 text-align:center 和 margin:0 auto。你可以去看一下别人写的这两种方法的博客
但有一个例子没加宽度也行,这是怎么回事
我加了个宽度好了
@charset "utf-8";
/* CSS Document */
*{
padding:0;
margin:0;
}
.wrap {
width:1000px;
background-color:#FFF;
font-size:12px;
margin:0 auto;
}
.top {
width:100%;
height:50px;
}
.top img{
display:block;
float:left;
width:200px;
}
.top ul li {
float:left;
list-style-type:none;
}
.top a{
width:120px;
height:70px;
display:block;
text-align:center;
line-height:70px;
font-size:16px;
font-family:"Microsoft YaHei UI";
}
.top a:link,.top a:visited{
text-decoration:none;
color:#000;
}
.top a:hover,.top a:active{
color:#000;
background-color:#BE3948;
text-decoration:none;
}
.ad {
margin-top:25px;
height:310px;
width:100%;
overflow:hidden;
}
你的css代码也放出来啊