CSS: div中的图片链接居中的问题
发布网友
发布时间:2022-04-21 00:56
我来回答
共4个回答
热心网友
时间:2022-04-21 02:25
我来给你一个完整的文件吧。呵呵。你运行一下,兼容各种浏览器,喜欢的话一定要多加点分哦。
http://hi.baidu.com/fenggandeguozi/blog/item/e675327b051e9fe82f73b37b.html
欢迎到我空间逛逛。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<title>无标题文档</title>
<style type="text/css">
.pp-list { height: 1%; overflow: hidden; display:table; border-spacing:10px; }
.pp-list li {border:1px solid #aaa; width:150px; height:150px; text-align:center; vertical-align:middle; position:relative; margin: 10px; *float:left; display: table-cell; }
.pp { *position:absolute; top:50%; }
.pp img { *position:relative; top:-50%; left:-50%; }
</style>
</head>
<body>
<ul class="pp-list">
<li><div class="pp"><img src="http://i0.sinaimg.cn/blog/08index/blog_mj_005_2.gif" ></div></li>
<li><div class="pp"><img src="http://mat1.qq.com/www/images/allskin/wmlogo.gif" ></div></li>
<li><div class="pp"><img src="http://img1.cache.netease.com/cnews/netease/logo_w.gif" ></div></li>
</ul>
</body>
</html>
热心网友
时间:2022-04-21 03:43
div
{
text-align:center;
}
img
{
margin:auto auto;
}
这种问题我也遇到过,加上以上这段代码就正常了,适合IE\IE7\firefox/祝你成功
热心网友
时间:2022-04-21 05:18
把第一句:<div style="width:200px;height:200px">
改成:<div style="width:200px;height:200px;line-height:500px; text-align:center;">
热心网友
时间:2022-04-21 07:09
你不是技术不过硬,你是根本还没弄懂css到底是怎么一回事