欢迎光临

木子屋

标题: css让页面制作更简单

作者: dnawo

日期: 2010-06-02 11:50 AM

分类: HTML/CSS

内容:
一个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">
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; /* 对齐方式 */
}
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)

登录

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 2.027 ms

返回

标题: css让页面制作更简单

你没有权限发表评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 2.027 ms

返回

暂无评论

返回

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 2.105 ms

返回