首页手记简单的一个div的使用，追求妹子的绝招！！

简单的一个div的使用，追求妹子的绝招！！

标签：

Java Html/CSS

<html>
<head>
<title>梦</title>

<style>
.by
{
width:75%;
height:90%;
border:2px red dashed;
margin:0 auto;

}
.tou
{
width:75%;
font-size:50px;
color:gray;
background-color:pink;
margin:0 auto;
}
.img1
{
border:2px green dashed;
width:550px;
margin-top:10px;
margin-left:90px;
padding-left:15px;
float:left;
color:gray;
}
.img2
{
border:2px green dashed;
width:550px;
margin-top:10px;
margin-left:90px;
padding-left:15px;
float:left;
color:gray;
}
.img3
{
border:2px green dashed;
width:550px;
margin-top:10px;
margin-left:90px;
padding-left:15px;
float:left;
color:gray;
}
.img4
{
border:2px green dashed;
width:550px;
margin-top:10px;
margin-left:90px;
padding-left:15px;

float:left;
color:gray;

}

span
{
color:green;
padding-left:240px;
}
</style>
</head>

<body>
<div class="by" >

            <div class="tou" align="center">
                商品列表
            </div>

            <div class="img1">

                    <img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="1.jpg">

                    <span>景点1</span>
            </div>
            <div class="img2">

                    <img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="2.jpg">

                    <span>景点2</span>
            </div>

            <div class="img3">

                    <img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="3.jpg">

                    <span>景点3</span>
            </div>
            <div class="img4">

                    <img class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="4.jpg">

                    <span>景点4</span>
            </div>

</div>

</body>
</html>

点击查看更多内容