UC知道网页设计中如何把比界面大的图片居中?
来源：百度知道 编辑：UC知道 时间：2024/06/07 14:04:40
如题，我电脑分辨率是1280*800，图片宽度是1587。图片宽度大于界面，一放上去就被系统默认左边对齐了，惨不忍睹啊。
p.s.我想让使用任何分辨率的电脑都能正常地阅览图片。所以不要告诉我把position设成负数之类的。谢谢大家。
算了，我把问题改了，大家帮我看一下这段code，哪里做错了，js function中本来应该出来的-477没有到位
<html>
<head>
<script type="text/javascript">
function pic1position()
{
var hspace
var width=screen.width
hspace=width-1757
if (hspace<=0)
{
return hspace
}
}
</script>
</head>
<body>
<img src="images/bg-t.jpg" width="1757" height="685" hspace="pic1position()">
</body>
</html>
p.s.我想让使用任何分辨率的电脑都能正常地阅览图片。所以不要告诉我把position设成负数之类的。谢谢大家。
算了，我把问题改了，大家帮我看一下这段code，哪里做错了，js function中本来应该出来的-477没有到位
<html>
<head>
<script type="text/javascript">
function pic1position()
{
var hspace
var width=screen.width
hspace=width-1757
if (hspace<=0)
{
return hspace
}
}
</script>
</head>
<body>
<img src="images/bg-t.jpg" width="1757" height="685" hspace="pic1position()">
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<style type="text/css">
<!--
.aaa { background-image: url(cp.gif); background-repeat: no-repeat; background-position: center center;}
.bbb { width: 0px; height: auto; overflow: hidden;}
-->
</style>
</head>
<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" class="aaa">
<tr>
<td><div class="bbb"><img src="cp.gif"></div></td>
</tr>
</table>
</body></html>
原理：
1.利用css设置aaa图片为背景，上下，左右全为居中显示
2.利用表格100%宽来自适应页面宽度
3.利用css div设置一个宽0高适应的层bbb，插入表格aaa内，来自动判定图片的高度
注意：aaa的背景与bbb中的图片为同一张图片，只有这样才能自动调节高度