您的位置:首页 > Web前端 > CSS

CSS基础-21CSS定位-浮动的应用,实现瀑布流布局

2015-08-01 17:14 876 查看

<!DOCTYPE html>
<!--CSS定位-浮动的应用,实现瀑布流布局-->
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link href="css03.css" type="text/css" rel="stylesheet">
</head>
<body>
<div id="mydiv1">
<ul>
<li>
<img src="images/item1.jpg">
</li>
<li>
<img src="images/item2.jpg">
</li>
<li>
<img src="images/item3.jpg">
</li>
</ul>
<ul>
<li>
<img src="images/item4.jpg">
</li>
<li>
<img src="images/item5.jpg">
</li>
<li>
<img src="images/item6.jpg">
</li>
</ul>
<ul>
<li>
<img src="images/item7.jpg">
</li>
<li>
<img src="images/item8.jpg">
</li>
<li>
<img src="images/item9.jpg">
</li>
</ul>

</div>

</body>
</html>
css:

* {
margin: 0px;
padding: 0px;
}

li {
list-style: none;
}

#mydiv1 {
width: 950px;
height: auto;
margin: 20px auto;

}

ul {
width: 300px;
float: left;
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: