UC知道网页图片大小设置（CSS）
来源：百度知道 编辑：UC知道 时间：2024/09/24 02:51:08
我用CSS设置了一个200*150的盒子，然后在里面要显示一张图片，如何让图片居中（水平居中和垂直居中）？并且，按原比例显示图片，但不得超过盒子的大小...
答对再给100分...
比如，我希望好几张不同比例的图片，显示在一个100*100的盒子里，但是希望它们都按比例缩小到这儿盒子里。
如果是100*200的图片，那么缩小后的图片就是50*100
如果是200*100的图片，那么缩小后的图片就是100*50
前提是我并不知道图片原大小是什么样子的，有谁能解决的吗？
答对再给100分...
比如，我希望好几张不同比例的图片，显示在一个100*100的盒子里，但是希望它们都按比例缩小到这儿盒子里。
如果是100*200的图片，那么缩小后的图片就是50*100
如果是200*100的图片，那么缩小后的图片就是100*50
前提是我并不知道图片原大小是什么样子的，有谁能解决的吗？
按原比例显示，只要指定图片的宽和高两者中的一个，另一个不要指定值，就是按比例显示了
居中的话，简单的
<div style="line-height: 150px; text-align：center; width: 200px; height: 150px; vertical-align: middle">
<img src="图片地址" width="180px">
</div>
.tb-p-c img {
vertical-align:middle;
}
.tb-p-c{
display: table-cell;
vertical-align:middle;
text-align:center;
}
background-image:url('../images/bg_tabbar.gif');background-repeat:no-repeat; background-position:center; text-align:center;
<!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">