
一个div加css即可完成上边的效果:
<!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>
<title>css</title>
<style type="text/css">
[color=Red]div
{
border-top:1px solid #6B90DA; background-color:#EBEFF9; width:200px; height:22px; /* 外观:长,宽,边框 */
font-size:15px; font-weight:bold; /* 文本样式 */
padding-left:3px; line-height:22px; /* 对齐方式 */
}[/color]
ul
{
list-style-type:none;
margin:0;
}
</style>
</head>
<body>
<div>酷站导航</div>
<ul>
<li>1.<a href="http://www.mzwu.com/">木子屋</a></li>
<li>2.<a href="http://www.163.com/">网易</a></li>
<li>3.<a href="http://www.baidu.com/">百度</a></li>
</ul>
</body>
</html>相比之下,用table来实现同样的效果则麻烦许多。div+css的优势不仅是让页面更简洁、更直观、可维护,而且还大大简化了页面制作过程,页面制作人员更轻松了。
评论(0)
暂无评论。