您的位置：首页 > 其它

inline-block 垂直居中

2014-04-12 16:39 351 查看

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
.test span{
background-color: red;
display: inline-block;
width: 8px;
height: 18px;
line-height: 18px;
}
.test i{
display: inline-block;
width: 8px;
height: 12px;
vertical-align: middle;
background-color: green;
}

.pageFlip{
position: absolute;
left: 325px;
top: 0px;
}
.pageFlip span{
display: inline-block;
padding: 0px 6px 0px 6px;
height: 18px;
line-height: 18px;
width: 8px;
border: 1px solid #d9d9d9;
background-color: #f2f2f2;

}
.pageFlip span i{
display: inline-block;
width: 8px;
height: 12px;
vertical-align: middle;
background-image: url("http://img.t.sinajs.cn/t5/style/images/common/icon.gif?id=201404081745");
background-position: -104px -327px;;
}
</style>
</head>
<body>
<div class='test'>
<span>
<i></i>
</span>
</div>

<div class="pageFlip">
<span class="pagePre">
<i></i>
</span>

</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航