老师,你的源码css ,html能否也共享一下,我想对照看一下
唔,刚刚有两行代码写做了,
<p>© All Rights Reserved 2014.<br>Find More at Pixelhint.com</p></div>(这一行没有div) 正确的:<p>© All Rights Reserved 2014.<br>Find More at Pixelhint.com</p> <p></p>France Restaurant<br>68, rue de la Couronne<br>75002 PARIS<br>02.94.23.69.56</div>(这一行也有问题) 正确的:<p>France Restaurant<br>68, rue de la Couronne<br>75002 PARIS<br>02.94.23.69.56</p>
这是我弄的html,我也跟着老师在写
<!doctype html> <html> <head> <meta charset="utf-8"> <title>i我的第一个页面</title> <link rel="stylesheet" href="css/index.css"/> <link rel="stylesheet" href="css/common.css"/> <link rel="stylesheet" href="css/reset.css"/> </head> <body> <div class="public-header"> <div class="public-container clearfloat"> <div class="header-logo"><a href=""></a></div> <ul class="header-nav clearfloat"> <li class="itme"><a href="">Our Story</a></li> <li class="itme"><a href="">Menu</a></li> <li class="itme"><a href=""></a>Reservations</li> <li class="itme"><a href=""></a>News</li> <li class="itme"><a href=""></a>Rviews</li> </ul> </div> </div> <!--公共头结束--> <div class="index-banner"></div> <!--Banner结束--> <div class="public-container index-list"></div> <!--推荐列表结束--> <div class="public-container index-panel"> <div class="index-panel-heder">Featured Dishes</div> </div> <!--轮播面板结束--> <div class="public-container index-panel"> <div class="index-panel-heder">Featured Dishes</div> </div> <!--普通面板结束--> <div class="public-footer"> <div class="public-container"> <div class="footer-col"> <p>New York Restaurant<br>3926 Anmoore Road<br>New York,NY 10014<br><a href="tel:718-749-1714">718-749-1714</a></p> </div> <div class="footer-col"> <p></p>France Restaurant<br>68, rue de la Couronne<br>75002 PARIS<br>02.94.23.69.56</div> </div> <div class="footer-col"> <a href="">Blog</a> <a href="">Careers</a> <a href="">Privacy Policy</a> <a href="">Contact</a> </div> <div class="footer-col"> <div class="footer-logo"></div> <p>© All Rights Reserved 2014.<br>Find More at Pixelhint.com</p></div> </div> </div> </div> <!--公共底结束--> </body> </html>
这部分是reset.css的代码
@charset "utf-8"; /* CSS Document */ body,div,dl,dt,dd,dt,ul,li,h1,h2,h3,h4,h5,h6,input,form,a,p,textarea{ margin:0; padding:0; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; } ol,ul,li{ list-style:none; } a{ text-decoration:none; display:block; color:#FFFFFF; } img{ border:none; display:block; } .clearfloat{ zoom:1; } .clearfloat:after{ display:block; clear:both; content:""; visibility:hidden; height:0; }
现在这部分是common.css的代码
@charset "utf-8"; /* CSS Document */ .public-header{ height:110px; } .public-header .header-logo{ float:left; margin-top:40px; } .public-header .header-logo a{ width:182px; height:54px; background:url(../imges/index-hader-logo.png); } .public-header .header-nav{ float:right; font-size:14px; } .public-header .header-nav .itme{ float:left; margin-top:44px; color:#3b3b3b; margin-left:50px; } .public-header .header-nav a{ color:#3d3d3d; } .public-header .header-nav a:hover{ text-decoration:underline; } .public-container{ position:relative; margin:0 auto; width:1100px; } .public-footer{ height:218px; padding-top:100px; background-color:#3b3b3b; } .public-footer .footer-col{ width:230px; float:left; margin-right:60px; font-size:16px; color:#fff; line-height:35px; } .public-footer .footer-col:last-child{ margin-right:0; } .public-footer .footer-logo{ width:182px; height:55px; margin-top:-10px; margin-bottom:12px; background-image:url(../imges/indx-footer-logo.png); }
我们可以互相参照一下,对比着看看