表格单元格中的锚定图像未调整为单元格宽度

时间:2015-11-11 03:03:47

标签: html css html5 image html-table

HTML5和CSS相当新。我正在尝试调整表格单元格中图像的大小,并且它的大小不会达到单元格的大小 - 任何帮助都会受到赞赏!

链接:http://mercury.ict.swin.edu.au/cos10020/s100505453/techno_syndicate/index.htm

HTML

 1    1   1
 2    1   2
 3    2   1 2
 4    2   1 3
 5    2   1 4
 6    3   1 2 3
 7    3   1 2 4
 8    3   1 2 5
 9    3   1 2 6
10    4   1 2 3 4
11    4   1 2 3 5
12    4   1 2 3 6
13    4   1 2 3 7
14    4   1 2 3 8
15    5   1 2 3 4 5
16    5   1 2 3 4 6
17    5   1 2 3 4 7
18    5   1 2 3 4 8
19    5   1 2 3 4 9
20    5   1 2 3 4 10
21    6   1 2 3 4 5 6
22    6   1 2 3 4 5 7

CSS

        <div class="artists">
        <table>
            <caption>
                <h1>Artists</h1>
            </caption>
            <tr>
                <td><a href=""><img src="img/artists/adrian_hour.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/anna.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/carl_craig.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/danny_daze.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/dubfire.jpg" alt=""></a></td>
            </tr>
            <tr>
                <td><a href=""><img src="img/artists/kink.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/matrixxman.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/mr_g.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/nicole_moudaber.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/nikola_gala.jpg" alt=""></a></td>
            </tr>
            <tr>
                <td><a href=""><img src="img/artists/oliver_huntemann.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/radio_slave.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/scuba.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/spencer_parker.jpg" alt=""></a></td>
                <td><a href=""><img src="img/artists/uto_karem.jpg" alt=""></a></td>
            </tr>
        </table>
    </div>

2 个答案:

答案 0 :(得分:0)

问题在于,针对最大宽度{im}的img规则会覆盖max-width: 100%;的{​​{1}}规则。宽度设置将被最小宽度和最大宽度覆盖。因此,只需为width: 20%;标记设置合适的宽度,例如,您可以执行td,并且所有图片都将适合放置。另外,要保持图像的纵横比,只需设置宽度或高度。

答案 1 :(得分:0)

更改

TIMESTAMP DEFAULT 0 ON UPDATE CURRENT_TIMESTAMP

REPLACE INTO currentdb.mytbl SELECT tempdb.mytbl WHERE updated > {previous max(updated)}

这应该有效。

这是一个JSFiddle供您使用https://jsfiddle.net/4paqqmg2/