CSS板块练习代码

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
.main{
width: 400px;
height: 500px;
background-color: #eee;
padding: 20px;
font-family: Arial;
}
.div1,.div2,.div3{
/*width: 400px;*/
height: 120px;
background-color:#fa1;
}
.div2,.div3{
margin-top: 20px;
}
.div1>img{
/*width: 150px;*/
float: left;
/*margin-top: 100px;*/
}
.div1>div{
width: 240px;
height: 92%;
background-color: #faa;
float: right;
padding-top: 10px;
padding-left: 10px;
}
.div1>div>h5{
font: 18px Arial;
margin: 0px;
}
.div1>div>p{
width: 210px;
margin: 0px;
/*overflow: hidden;*/
word-break:break-all;
padding-bottom: 4px;
border-bottom:1px solid #bbb;
}
.samll{
width: 90%;
height: 35px;
background-color: #fff;
}
.samll>strong{
font-size: 24px;
font-weight: 900;
float: left;
margin-top: 3px;
}
.sp{
padding: 4px 9px;
background-color: #A3C809;
border-radius: 3px;
margin-left: 39px;
float: left;
margin-top: 5px;
cursor: pointer;
}
.sp span{
padding: 0px 6px;
font-weight: bolder;
background-color: #567611;
border-radius:100%;
color: #fff;
float: left;
}
.samll span button{

}
</style>
</head>
<body>
<div class="main">
<div class="div1">
<img src="1.jpg">
<div>
<h5>KIch 好的呵呵</h5>
<p>fbefhuriewhgiouergbouierbhuiotbo
jkewqflu</p>
<div class="samll">
<strong>1248$</strong>
<a href="www.djkewcfu.com" class="sp"><span>i</span></a>
</div>
</div>
</div>
<div class="div2"></div>
<div class="div3"></div>
<div class="div4"></div>
</div>
</body>
</html>

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。