对齐的图像中的与所述中间; TD>&所述; / TD> [英] Align an image in the middle of <td></td>

查看:297
本文介绍了对齐的图像中的与所述中间; TD>&所述; / TD>的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有以下的code:

 < TD>
< IMG SRC =some_image_url.png级=PNG/>
< IMG SRC =another_image_url.jpg/>
< / TD>
 

本的CSS为类=PNG是:

 巴纽{
    位置:绝对的;
}
 

我怎样才能让售罄图像显示在中间,因为其他图像对齐?

感谢。

编辑:下面是对的CSS在 TD

  .something TD {
    填充:7px的;
    宽度:20%;
    文本对齐:中心;
    垂直对齐:首位;
}
 

解决方案

尝试这样的:

  TD
{
  位置:亲属; / *如果是IE * /
  / *位置:固定;如果是mozila * /
}
    .PNG,.JPG
    {
        位置:绝对的;
        左:50%;
        顶部:50%;
    }
    巴纽
        {
            的margin-top:其中;把PNG&GT的高度,这里一半;
            利润率左:其中;把PNG&GT的宽度在这里一半;
        }
 

添加一个类JPG格式的JPG图片

更新:我再次编辑它,这对我的作品...
请确保您的TD是足够大的。

I have the following code:

<td>
<img src="some_image_url.png" class="png" />
<img src="another_image_url.jpg" />
</td>

The .css for the class="png" is:

.png {
    position:absolute;
}

How can I make the Sold Out image to be shown in the middle, as the other image is aligned?

Thanks.

EDIT: Here's the .css for the td:

.something td {
    padding: 7px;
    width: 20%;
    text-align: center;
    vertical-align: top;
}

解决方案

try it like this:

td
{
  position: relative; /* if it's IE */
  /* position: fixed;  if it's mozila */
}
    .png , .jpg
    {
        position:absolute;
        left:50%;
        top:50%;
    }
    .png
        {
            margin-top: <put here half of the height of png>
            margin-left: <put here half of the width of png>
        }

add a class jpg to the jpg image

UPDATE: I edited it again, this works for me ...
make sure that your td is big enough

这篇关于对齐的图像中的与所述中间; TD&GT;&所述; / TD&GT;的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆