css,使一个图片，在一个div块中，上下居中，靠左20px.
<divid="abc"><imgsrc="a.jpg"id="a"/><imgsrc="b.jpg"id="b"/>//使这图相对于#abc上下居中，靠左20px</d...
<div id="abc">
<img src="a.jpg" id="a"/>
<img src="b.jpg" id="b"/>//使这图相对于#abc上下居中，靠左20px
</div>
要兼容ie8 firefox3.5 展开
<img src="a.jpg" id="a"/>
<img src="b.jpg" id="b"/>//使这图相对于#abc上下居中，靠左20px
</div>
要兼容ie8 firefox3.5 展开
4个回答
展开全部
简简单单
<!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=big5" />
<title>aaaa</title>
<style>
*{ margin:0; padding:0; }
#abc{ height:200px; line-height:200p; border:2px solid}
#b{ width:96px; position:relative; top:50%; margin-top:-48px; margin-left:20px;}
</style>
</head>
<body>
<div id="abc">
<img src="img/SushiSkype.png" id="b"/>
</div>
</body>
</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=big5" />
<title>aaaa</title>
<style>
*{ margin:0; padding:0; }
#abc{ height:200px; line-height:200p; border:2px solid}
#b{ width:96px; position:relative; top:50%; margin-top:-48px; margin-left:20px;}
</style>
</head>
<body>
<div id="abc">
<img src="img/SushiSkype.png" id="b"/>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
楼上的正解。
不过小弟有个疑问？楼主提供的代码中有两张图片，ID为“B”的图片绝对居中或相对居中后，不就覆盖了ID为“A”的图片了？？？怎么解决？？哈哈……还是楼主故意这么写的！！
不过小弟有个疑问？楼主提供的代码中有两张图片，ID为“B”的图片绝对居中或相对居中后，不就覆盖了ID为“A”的图片了？？？怎么解决？？哈哈……还是楼主故意这么写的！！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这里是你要的效果：http://www.webfeike.net/pic_other/shi1/chuizhi.htm
代码在下面，兼容，IE6,IE7,IE8,FF
<style type="text/css">
* {
margin: 0;
padding: 0;
border: 0;
}
html,body {
height:100%;
}
#abc {
height:100%;
}
#abc_last {
position:absolute;
top:50%;
left:0;
}
#b{
width: 164px;
height: 114px;
position: absolute;
margin-top: -57px;
margin-bottom: -57px;
margin-left: 20px;
overflow: hidden;
}
</style>
<body>
<div id="abc">
<div id="abc_last" >
<img id="b" src="b.jpg" alt="这就是你要的效果，上下居中，距左20px" />
</div>
</div>
</body>
代码在下面，兼容，IE6,IE7,IE8,FF
<style type="text/css">
* {
margin: 0;
padding: 0;
border: 0;
}
html,body {
height:100%;
}
#abc {
height:100%;
}
#abc_last {
position:absolute;
top:50%;
left:0;
}
#b{
width: 164px;
height: 114px;
position: absolute;
margin-top: -57px;
margin-bottom: -57px;
margin-left: 20px;
overflow: hidden;
}
</style>
<body>
<div id="abc">
<div id="abc_last" >
<img id="b" src="b.jpg" alt="这就是你要的效果，上下居中，距左20px" />
</div>
</div>
</body>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
