现在要实现的效果是：
使用的代码：
<!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></title>
<style type="text/css">
*{margin:0;padding:0;font-size:12px;}
.box{width:300px;margin:100px auto;border:1px #999 solid;}
h3{height:30px;line-height:30px;padding-left:10px;border-bottom:1px #999 solid; position:relative; overflow:hidden; background:#2EA7EC; color:#FFff00; font-size:14px;}
h3 b{display:block; position:absolute;top:0;right:0;width:40px;height:30px;line-height:30px;color:#fff; background-color:#2EA7EC}
.box div{height:auto;padding:10px; font-size:11px;}
.box div ul{
list-style-type:none;
}
.box div li{
height:20px;
line-height:20px;
font-size:12px;
}
</style>
</head>
<body>
<!--
功能：css实现小版块的布局
开发：wangsdong
网址：www.aspprogram.cn
原创文章，转载请保留此信息
-->
<div class="box">
<h3>分类标题<b>更多</b></h3>
<div>
<ul>
<li><a href="#" target="_blank">新闻标题新闻标题新闻标题新闻标题新闻标题</a></li>
<li><a href="#" target="_blank">新闻标题新闻标题新闻标题新闻标题新闻标题</a></li>
<li><a href="#" target="_blank">新闻标题新闻标题新闻标题新闻标题新闻标题</a></li>
<li><a href="#" target="_blank">新闻标题新闻标题新闻标题新闻标题新闻标题</a></li>
<li><a href="#" target="_blank">新闻标题新闻标题新闻标题新闻标题新闻标题</a></li>
<li><a href="#" target="_blank">新闻标题新闻标题新闻标题新闻标题新闻标题</a></li>
</ul>
</div>
</div>
</body>
</html>
- 教程
- 软件
- 源码
css实现页面上小版块的布局
2009-04-15 21:51:23 来源：aspprogram.cn 作者：佚名 浏览量:2402 收藏
上一篇： select表单中禁止选择某些项
下一篇： 电子邮件正文预先设置包含的内容
Copyright(C)2013-2017版权所属asp编程网