自定义表td witdh

Question

问题：

HTML

<div class="visible-sm visible-xs " id="aatablet" style="padding-left: 0px; padding-bottom:10px; padding-top:10px; text-align: center;">
        <table border="1">
            <tr>
                <td colspan="4" class="item_title">
                    <div style="padding-top:5px;">
                        Available at:
                    </div>
                </td>
            </tr>
            <tr>
                <td >
                    <img src="img/amazon-lrg.gif" alt="amazon" />

                </td>
                <td>
                    <img src="img/ebay-lrg.gif" alt="ebay" />
                </td>
                <td >
                    <img src="img/tomatomill-lrg.gif" alt="tomatomill" />
                </td>
                <td ><img src="img/BBG-lrg.gif" alt="BBG" />
                </td>  
                </tr>  
                <tr>    
                    <td >
                 </td>            
                <td>
                    <img src="img/sears-lrg.gif" alt="sears" />
                </td>                 
                <td >
                    <img src="img/healthcraft-home-logo.gif" alt="Healthcraft" title="Healthcraft" />
                </td>
                 <td >
                     <img src="img/paradisecozycabins.jpg" alt="paradisecozycabins" title="paradisecozycabins" />

                 </td>
            </tr>
        </table>
    </div>

CSS

 #aatablet > table {
margin:0 auto;
}

框架：bootstrap 3.4。

我想制作番茄标志宽度100px而非178px，如Helt Craft和td of Paradise（最后一次）50px而非150px，如BIGGAME。 有人可以帮助我吗？我不擅长制作自定义表。是否可以只使用CSS？ Ty all。

Answer 1

您可以为td提供<div class="container"> <form class="form-horizontal"> <div class="row"> <div> <ul class="nav nav-tabs"> <li class="active"><a href="#a" data-toggle="tab">Primary Information</a></li> <li><a href="#b" data-toggle="tab">Additional Information</a></li> <li><a href="#c" data-toggle="tab">More Details</a></li> </ul> <div class="tab-content"> <div class="tab-pane fade in active" id="a"> <br/> </div> <div class="tab-pane fade" id="b"> <br/> </div> <div class="tab-pane fade" id="c"> <br/> </div> </div> <hr/> <div class="col-lg-5 pull-right"> <div class=""> <button id="save" name="save" class="btn btn-primary col-lg-5 pull-right">Save</button> </div> </div> </div> </div> </form> </div> 并给出单独的宽度。使用inline:block

定位每个td

:nth-of-type