浮动图片的css实现
来源：互联网 发布：js namespace 编辑：程序博客网 时间：2024/04/20 11:13
<!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=gbk" />
<title>图片排列</title>
<style>
.box{border:1px #999999 solid;width:600px;overflow:hidden;}
.box .title{border:0 #999999 solid; border-bottom-width:1px; padding:10px;height: 20px;line-height: 20px;}
.box .title h3{margin: 0;padding: 0;font-size: 15px;float: left;font-weight: bold;color: #000000;}
.box .title h5{margin: 0;padding: 0;float: left;font-size:12px;color:#666666;font-weight: normal;padding-left: 5px;}
.box .main {border:0 #999999 solid;padding:0;}
.box .main ul{list-style:none;margin:5px;padding:0px;}
.box .main ul li{float:left;display:inline;margin:2px;}
.box .main ul a{}
.box .main ul li img{padding:3px;border:1px #999 solid;}
.box .main ul li a:hover{zoom:1;} <!--不添加这个句子，当然大括号里面可以写人和内容。ie6下没有效果-->
.box .main ul li a:hover img{border:1px #f00 solid;}
.box .main br {clear:both;}
</style>
</head>
<body>
<div class="box">
<div class="title">
<h3>图片</h3>
<h5> (<a href="#">共<span class="red">7张</span></a>)</h5></div>
<div class="main">
<ul><li><a href="#"><img src="http://image-7.verycd.com/2064b6f2aba2ce4327af67f3f5c77e56126686%2875x75%29/thumb.jpg" alt=""></a></li>
<li><a href="#"><img src="http://image-7.verycd.com/8d181c0df47e897bd6396a62f73373df151311%2875x75%29/thumb.jpg" alt=""></a></li>
<li><a href="#" ><img src="http://image-7.verycd.com/25e959215219c3fc35c6112664a69c28105460%2875x75%29/thumb.jpg" alt=""></a></li>
<li><a href="#"><img src="http://image-7.verycd.com/3fc790907992e784226785bfa13e3a03106465%2875x75%29/thumb.jpg" alt=""></a></li>
<li><a href="#"><img src="http://image-7.verycd.com/49d290df0949ecdfd1f07626288fb8e8187591%2875x75%29/thumb.jpg" alt=""></a></li>
<li><a href="#"><img src="http://image-7.verycd.com/4394fd47180a3abe2048dab9cff1f752247870%2875x75%29/thumb.jpg" alt=""></a></li>
<li><a href="#"><img src="http://image-7.verycd.com/1d462fec26f336121d3bf1da1ba2dc3a75491%2875x75%29/thumb.jpg" alt=""></a></li> </ul>
<br>
</div>
</div>
</body>
</html>
- 浮动图片的css实现
- CSS实现图片向上浮动
- css+js实现 不影响周边内容的浮动图片
- 用css实现链接经过时显示浮动图片背景的效果
- js实现图片浮动的效果
- js 实现一个图片浮动的效果
- JavaScript实现图片的浮动效果
- 实现多张图片的浮动代码
- 实现多张图片浮动的效果
- JavaScript实现图片的浮动效果
- 图片浮动 javascript实现
- js实现图片浮动
- css：浮动的理解。
- CSS的浮动效果
- CSS的浮动
- css浮动的问题
- CSS的浮动问题
- CSS浮动的原理
- jquery 写的坦克大战。。。
- 教你如何解除试用版软件的期限
- 桥接模式（Bridge Pattern）要点
- MS Chart 中SeriesChartType 枚举值对应的说明
- oracle中行数据转换列数据
- 浮动图片的css实现
- 【转】Transact SQL教程（一）
- C语言运算符优先级 详细列表
- Oracle用Start with...Connect By子句递归查询
- 解决 ie 不能识别 div 中的name属性
- 堆排序
- 如何让提高网站访问速度
- Java与Flex间的通信构造
- 酒桌上的DOTA原理
