跟我一起重写JAVA WEB网络硬盘( 2 )

最新推荐文章于 2024-05-11 22:29:37 发布

hacke2

最新推荐文章于 2024-05-11 22:29:37 发布

阅读量4.5k

点赞数 1

分类专栏：跟我一起重写JAVA WEB网络硬盘技术文章 WEB开发

本文链接：https://blog.csdn.net/hacke2/article/details/8615461

版权

技术文章同时被 3 个专栏收录

52 篇文章 0 订阅

订阅专栏

WEB开发

22 篇文章 0 订阅

订阅专栏

跟我一起重写JAVA WEB网络硬盘

4 篇文章 0 订阅

订阅专栏

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>

hacke2

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
跟我一起重写JAVA WEB网络硬盘( 2 )

2013-2-26 20:40:05 刚闲着没事又把header和nav写了一下，出了一点小问题：.想把logo做成标签的形式方便搜索引擎搜索，但是header的背景却遮盖住了logo，用浮动也只能显示一半，不知道怎么解决！ 2013-2-26 21:29:47（重新编辑）晕...发上后看到heigth怎么没标亮？结果一看打错了 - -应该是height..现在就可以
复制链接

扫一扫