欢迎来到Doc100.Net免费学习资源知识分享平台!
您的位置:首页 > 程序异常 >

margin-top为何不起作用,该怎么解决

更新时间: 2014-01-05 00:52:24 责任编辑: Author_N1

 

margin-top为何不起作用
<!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">
body{margin:0 auto;padding:0; font-size:12px; font-family:"宋体";}
h1,h2,h3,ul,li,img,p{margin:0; padding:0; border:0; list-style:none;}
.clear{clear:both;}
.wrapper{width:990px; margin:0 auto;}
.top{width:990px; height:56px; margin:0 auto; background-color:#f44b47;}
.top h1{height:56px; line-height:56px; text-align:center; font-size:32.63px; color:#fff; font-weight:bold;}
.top h1 span{color:#fae855;}


.hezi{width:990px; margin:0 auto; margin-top:12px;}
/*第一部分*/
.hezi ul{}
.hezi ul li{}

.hezi ul li.tishi{width:323px;  border:1px solid #ccc; float:left; margin-right:7px; overflow:hidden;}
.hezi ul li.tishi .ting{height:87px;}
.ting .left{padding-left:4px;float:left; width:70px; height:80px; margin-top:4px;}
.ting .left img{width:70px; height:80px;}
.ting .right{float:left;margin-left:6px; width:237px;height:71px; background:url(images/2.jpg) no-repeat; margin-top:11px;}

.tishi .zu{height:33px; line-height:33px;background:#e1e1e1; margin-top:3px; }
.zu h3{text-align:center; font-size:14px; color:#000;}

.tishi .tupian{padding-top:10px; height:182px;}
.tishi .tupian img{padding:0 80px; height:182px;}
.tishi .dibu{margin-top:3px;padding-left:10px; padding-bottom:8px;}
.dibu button{float:right; width:140px; height:60px; line-height:60px; font-size:21.78px; color:#60490c;background:#ffce4d; margin-right:6px;}

.dibu span.spec1{display:inline-block; float:left;margin-top:5px; background:url(images/5.jpg) no-repeat; text-align:right; width:147px; height:30px; line-height:30px; font-size:28px; font-weight:bold; color:#682121;}

.dibu span.spec2{font-size:14px; color:#909090; display:inline-block; font-weight:bold; margin-top:7px;}

/*第二部分开始*/
.main{margin-top:42px;}
.main-top{height:54px;}
.main-top ul{}
.main-top ul li{float:left;}
.main-top ul li.one{background:url(images/7.jpg) no-repeat; width:93px; height:50px;}
.main-top ul li.two{width:804px; background:#ee2f2c; height:50px;}
.main-top ul li.three{background:url(images/8.jpg) no-repeat; width:93px; height:50px;}

 
</style>
</head>

<body>
<div class="wrapper>
     <div class="top">
         <h1>周末每晚<span>8</span>点特惠秒杀</h1>
        </div>
<!--第一部分开始-->
        <div class="hezi">

         <ul>
             <li class="tishi clear">
                 <div class="ting clear">
                     <div class="left"><img src="images/1.jpg"></div>
                        <div class="right"><h3>2013-03-06</h3><span>倒计时</span></div>
                    </div>
<div class="zu">
<h3>专业方程式特护修纹眼霜15ml</h3>
</div>
<div class="tupian">
<img src="images/4.jpg" alt="图片">
</div>
<div class="zu">
<h3>限量1000件,每人限购5件</h3>
</div>
<div class="dibu clear">
                        <button>按原价购买</button>
<span class="spec1">10.99元</span>
<br/>
<span class="spec2">原价:100元</span>

</div>
                </li>
<li class="tishi">
                 <div class="ting clear">
                     <div class="left"><img src="images/1.jpg"></div>
                        <div class="right"><h3>2013-03-06</h3><span>倒计时</span></div>
上一篇:上一篇
下一篇:下一篇

 

随机推荐程序问答结果

 

 

如对文章有任何疑问请提交到问题反馈,或者您对内容不满意,请您反馈给我们DOC100.NET论坛发贴求解。
DOC100.NET资源网,机器学习分类整理更新日期::2014-01-05 00:52:24
如需转载,请注明文章出处和来源网址:http://www.doc100.net/bugs/t/831/
本文WWW.DOC100.NET DOC100.NET版权所有。