码迷,mamicode.com
首页 > Web开发 > 详细

css 图片

时间:2015-05-13 18:57:54      阅读:118      评论:0      收藏:0      [点我收藏+]

标签:

 

<div class="image">
<a href="#" target="_self">
<img src="picture.jpg" alt="p" width="200px" height="200px">
</a>
<div class="text">8888888</div>
</div>
<div class="image">
<a href="#" target="_self">
<img src="picture.jpg" alt="p" width="200px" height="200px">
</a>
<div class="text">8888888</div>
</div>
<div class="image">
<a href="#" target="_self">
<img src="picture.jpg" alt="p" width="200px" height="200px">
</a>
<div class="text">8888888</div>
</div>

 

 

body{
height: auto;
width: 70%;
margin: 10px auto;
}
li{
/* 水平排列*/
display: inline;
/* 内边距为3px*/
padding: 3px;
padding-right: 33px;
/* visibility: hidden;*/
}
.image{
border: 1px solid darkgray;
width: auto;
height: auto;
float: left;
margin: 5px 5px;
text-align: center;
}
img{


/*透明度*/
opacity: 0.4;
margin: 5px;

}
.text{

/* 外边距与底部距离*/
margin-bottom: 5px;
font-size: 12px;
}

css 图片

标签:

原文地址:http://www.cnblogs.com/xiezefeng/p/4500841.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!