标签：
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <title>项目实战--PC端固定布局</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <nav id="nav"> <section class="center"> <h1>旅游</h1> <ul class="link"> <li class="active"><a href="###">首页</a></li> <li><a href="###">资讯</a></li> <li><a href="###">新闻</a></li> <li><a href="###">简介</a></li> </ul> </section> </nav> <header>header</header> <section>body</section> <footer>footer</footer> </body> </html>
@charset "utf-8"; body,h1,ul{ margin: 0; padding: 0; } ul{ list-style: outside none none; //简写属性 在一个声明中设置所有的列表属性。 } a{ text-decoration: none; //CSS文字修饰为无；一般用于设置清除超链接的默认下划线： } #nav { width: 100%; height: 70px; background-color: #333; } .center{ width: 1263px; height: 70px; margin: 0 auto; } .center h1{ width: 240px; height: 70px; text-indent: -9999px; float: left; } .link{ width: 650px; height: 70px; line-height: 70px; color: #eee; float: right; } .link li{ width: 120px; text-align: center; float: left; } .link a{ color: #eee; display: block; // } .link a:hover, .active a{ background-color: #000; }
标签：
原文地址：http://www.cnblogs.com/ransky/p/5747430.html
