页面排版简单样式demo
<!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" xml:lang="zh-cn"> <head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /><title>网页标题</title><meta name="keywords" content="关键字列表" /><meta name="description" content="网页描述" /><link rel="stylesheet" type="text/css" href="" /><style type="text/css">*{margin:0px;padding:0px;}ul li{list-style:none;}a:link,a:visited{text-decoration:none;color:#000;}a:hover{color:#ccc;background:#f00;}.box{width:500px;height:600px;margin:0 auto;border:2px solid #00f;}.header{width:410px;height:40px;border-bottom:3px solid #f00;line-height:40px;padding-right:90px;}.header h4{margin-left:40px;float:left;font-weight:bold;}.header ul{float:right;}.header ul li{float:left;width:60px;height:40px;text-align:center;margin:0 2px;background:#c8c8c8;}.header a{display:block;width:60px;height:40px;}.content{background:url(bg.gif) no-repeat left 2px;margin-left:10px;}.content ul{width:500px;height:400px;}.content ul li{height:25px;line-height:24px;padding-left:18px;}</style><script type="text/javascript"></script> </head> <body> <div class="box"><div class="header"><h4>新闻排行</h4><ul><li><a href="#">国内</a></li><li><a href="#">国际</a></li><li><a href="#">社会</a></li><li><a href="#">网评</a></li></ul></div><div class="content"><ul><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li><li>示例随机数、混凝土强度自动计算、工程概况自动填写</li></ul></div></div></body> </html>
