css盒子模型学习

<head runat="server">
<title></title>
<style type="text/css">
body
{
margin:0px;
}
.div1
{
800px;
height:500px;
border:1px solid #b4b4b4;
margin-left:50px;
margin-top:50px;

}
.img1
{
50px;
height:50px;
}
.ul1
{
500px;
height:400px;
border:1px solid red;
list-style-type :none;

}
.ul1 li
{
50px;
height:50px;
border:1px solid red;
float:left;
margin-left :10px;
margin-top:5px;

}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="div1">
<ul class="ul1">
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
<li><img src="/NewFolder1/123.png" class="img1" /></li>
</ul>
</div>
</form>
</body>
</html>

效果如下

原文地址:https://www.cnblogs.com/xu3593/p/2935904.html