-1

我想在每个框中显示 16 个框，我想显示三个图像。

例如：

<tr>
    <td style="width:auto; padding:15px;">
        <img src="/static/images/seo1.jpg" >
    </td>
    <td style="width:300px; padding:15px;">
        <img src="/static/images/seo1.jpg" >
    </td>
    <td style="width:300px; padding:15px;">
        <img src="/static/images/seo1.jpg" >
    </td>
    <td style="width:300px; padding:15px;">
        <img src="/static/images/seo1.jpg" >
    </td>
</tr>

到目前为止，我有一张 4x4 的表格，上面只显示了单行。

现在我将如何进行以实现这一目标.. 将表是此类问题的不错选择....

我想要这个

<table cellpadding="0" cellspacing="0" border="0">
    <tr>
       <td style="width:auto;">

            <img src="/static/images/seo1.jpg" height="50" width="50">    
        </td>

        <td style="width:auto;">
            <img src="/static/images/seo1.jpg" height="50" width="50">    
        </td>
    </tr>

    <tr>
        <td colspan="2"  style="width:auto;">

            <img src="/static/images/seo1.jpg" height="50" width="100">
        </td>
    </tr

但是如果我把这张桌子放在主桌子上，它的整个结构就会迷失方向……我想要这种类型的结构放在 16 个单独的盒子里……

4

2 回答 2

1

请问您为什么使用表格而不是DIV？但是，只需复制您的 img 代码，这就是您在每个框中显示 3 张图像的方式。

<tr>
    <td style="width:auto; padding:15px;">
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
    </td>
    <td style="width:300px; padding:15px;">
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
    </td>
    <td style="width:300px; padding:15px;">
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
    </td>
    <td style="width:300px; padding:15px;">
       <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
        <img src="/static/images/seo1.jpg" >
    </td>
</tr>
于 2013-03-25T12:14:06.533 回答
0

现在谁来创造16 个盒子？？

如果你知道 jQuery，它会更简单。

<div id="main"></div>

//As I always avoid using table's
for(var i=0;i<4;i++){
    $('#main').append('<div></div>');
    for(var j=0;j<4;j++){
        $('#main>div').eq(i).append('<div></div>');
    }
}

然后使用CSS：

#main>div>div{float:left;/*some width and height values here*/}

工作小提琴

于 2013-03-25T12:19:32.653 回答