跟我一起重写JAVA WEB网络硬盘( 2 )
2013-2-26 20:40:05
刚闲着没事又把header和nav写了一下,出了一点小问题:
.想把logo做成<h1>标签的形式方便搜索引擎搜索,但是header的背景却遮盖住了logo,用浮动也只能显示一半,不知道怎么解决!
2013-2-26 21:29:47(重新编辑)
晕...发上后看到heigth怎么没标亮?结果一看打错了 - -应该是height..现在就可以用<h1>了
basic.css
* {margin:0;padding:0;}a {text-decoration:none;}ul {list-style-type:none;}body {width:860px;margin:0 auto;font-size:12px;background:#ccc;}#header {height:80px;margin:0 auto;background:#4380DB url(../images/logo.jpg) no-repeat;}#header h1{background:;width:199px;heigth:100px;font-size:100%;}#header ul li {width:60px;float:right;}#header ul li a{color:#fff;}#header ul li a:hover{font-weight:bold;}#nav {height:35px;background:#eee;}#nav ul{background:#eee;}#nav ul li {float:left;width:144px;height:35px;}#nav ul li a{text-align:center;font-size:150%;font-weight:bolder;font-family:Microsoft YaHei;line-height:35px; width:140px;height:35px;display:inline-block;color:#4380DB;}#nav ul li.lastnav{width:140px;}#nav ul li a:hover{background:#4380DB;color:#eee;}#adv {width:550px;height:420px;background:pink;float:left;}#login {width:300px;height:420px;background:blue;float:right;}#share {width:550px;height:420px;background:green;float:left;}#rank {width:300px;height:420px;background:orange;float:right;}#footer {height:80px;background:black;clear:both;}
index.html
<!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>CQUT网络硬盘</title><link rel="stylesheet" type="text/css" href="styles/basic.css" /><script type="text/javascript" src="js/jquery-1.7.min.js"></script></head><body><div id="header"><ul><li><a href="#">关于本站</a></li><li><a href="#">帮助文档</a></li><li><a href="#">网站首页</a></li></ul></div><div id="nav"><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 class="lastnav"><a href="#">####</a></li></ul></div> <div id="adv">adv</div><div id="login">login</div> <div id="share">share</div> <div id="rank">rank</div><div id="footer">footer</div></body></html>