查看: 57|回复: 3

问一个CSS的问题

[复制链接]

dd.娘孓

电梯直达

1^#

发表于 2010-1-14 07:00:28 | 只看该作者回帖奖励

|正序浏览 |阅读模式

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="gb2312">
<head>
<title>测试</title>

<style type="text/css">
body{
font-size:10pt;
background-color:#eeeeee;
color:#000000;
margin:0px;
}
div{
word-break:break-all;
}
#all{
text-align:center;
}
#top{
width:698px;
height:120px;
border-left:1px solid #000000;
border-right:1px solid #000000;
}
#map{
width:688px;
border-left:1px solid #000000;
border-right:1px solid #000000;
text-align:left;
padding:5px;
border-bottom:1px dotted #999999;
}
.b1{
font-size:10pt;
font-weight:bold;
}
.b2{
font-size:10pt;
font-style:italic;
}
.b3
{
color:gray;
font-style:italic;
}
#main{
width:698px;
border-left:1px solid #000000;
border-right:1px solid #000000;
text-align:left;
}
#username{
width:110px;
border-bottom:1px solid #999999;
padding:5px;
height:10px;
text-align:left;
border-right:1px solid #999999;
}
#userinfo
{
width:570px;
border-bottom:1px solid #999999;
padding:5px;
height:10px;
text-align:left;
float:right;
}
#admin{
float:right;
}
#menu{
width:698px;
height:30px;
border-left:1px solid #000000;
border-right:1px solid #000000;
background-color:#555555;
margin:0px;
padding:0px;
}
#menu ul{
list-style-type:none;
float:left;
margin:0px;
padding:0px;
}
#menu li{
list-style-type:none;
height:30px;
width:60px;
float:left;
}
#menu a{
display:block;
border-right:1px dotted #ffffff;
text-align:center;
color:#888888;
height:22px;
width:60px;
padding-top:8px;
}
#menu a:link{
text-decoration:none;
color:#ffffff;
}
#menu a:visited{
text-decoration:none;
color:#ffffff;
}
#menu a:hover{
color:#000000;
text-decoration:none;
background-color:#ffffff;
}
</style>
</head>
<body>
<div id="all">
<div id="top">
<div id="bookname"></div>
</div>
<div id="menu">
<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><a href="#">留言</a></li>
<li><a href="#">链接</a></li>
</ul>
</div>
<div id="map"><span class="b1">你的位置：</span><span class="b2"><a href="">我的博客</a> >></span> <span class="b3">给我留言</span></div>
<div id="main">
<div id="book">
<div id="username">网友：无根泉</div>
<div id="userinfo">
<div id="info">
QQ:272431763 MAIL:ghost210@163.com POST:2006-3-26
</div>
<div id="admin">
<a href="#">书写</a>
<a href="#">回复</a>
<a href="#">删除</a>
<a href="#">顶端</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
怎么才能让那一行对齐啊

收藏0