-1

表のセル内に縮小された画像を追加しようとしています。どういうわけか、スケーリングされた画像はまだ元のサイズを占めています。

これは私がこれまでに持っているものです（更新済み）

http://jsfiddle.net/qnUgx/1/

コード

<img style="display: block;width:250px;height:auto" src="http://www.ucmas.com/wp-content/uploads/2013/06/DinoArt-Logo.png"/>

6 番目と 7 番目の項目の間にギャップがあることに気付いた場合は、スケーリングの方法がまだ間違っていると思います。どうすればギャップを取り除くことができますか?

このソリューションでは、表の直後にコンテンツを表示できるようにする必要もあります。

4

2 に答える 2

2

ROWSPAN サイズを変更し、6 番目と 7 番目のアイテムの間のギャップを取り除きます。

このような、

<table>
    <tr>
        <th>The 7 main categories in Dino Art:</th>
        <td rowspan="9"><img style="display: block;width:250px;height:auto" src="http://www.ucmas.com/wp-content/uploads/2013/06/DinoArt-Logo.png"/> </td>
    </tr>
    <tr>
        <td>111111</td>
    </tr>
    <tr>
        <td>222222</td>
    </tr>
    <tr>
        <td>3333333</td>
    </tr>
    <tr>
        <td>444444</td>
    </tr>
    <tr>
        <td>555555</td>
    </tr>
    <tr>
        <td>666666</td>
    </tr>
    <tr>
        <td>777777</td>
    </tr>
</table>
于 2013-08-27T06:00:28.610 に答える
0

次のようにimgタグの高さ幅属性を使用します

 <td rowspan = 8><img   height = 100 width = 100 src="http://www.ucmas.com/wp-content/uploads/2013/06/DinoArt-Logo.png"/> </td>
于 2013-08-27T06:05:55.320 に答える