如何在HTML表的TD内部拟合图像

Question

I am displaying an image inside TD using:

But image seems to be taking larger width than the width defined for the TD.

Please provide me some solution.

Answer 1

CSS solution

td img {
    max-width:100%;
    height:auto;
}

Answer 2

You could try this:

If you want ALL <td> 's to have images:

HTML:

<table class="imagetable">

<tr>

<td>Hey wat up</td>

</tr>

</table>

CSS:

.tableimage td {
background-image:url('http://example.com/image.jpg');
background-size: 100% 100%;
}

If you just want ONE <td> to have an image

HTML:

<td class="image">Hey wat up</td>

CSS:

.image {
background-image:url('http://example.com/image.jpg');
background-size: 100% 100%;
}

Hope this helps :)