Question

我制作了这些表，第一个表格的设计是我想要的设计，但是第二个表格的设计在左右列之间的空间较小。为什么？如何修复第二个设计，以便第二个表格得到第一个设计？谢谢！

                    <div class="_hsync_login_form">
                    <p style="font-family: 'Noto Sans'; text-align: center;">
                        Došli ste do kraja, no prije samog kraja još jednom pregledajte sve podatke koje ste upisali. Ukoliko niste zadovoljni podacima, registraciju možete vrlo lako resetirati.
                    </p>
                    <p style="font-family: 'Noto Sans'; text-align: center;">
                        Napominjemo da nakon prve prijave na server morate proći kroz roleplay test. Ukoliko Vam je potrebno, također možete proći kroz roleplay predavanje koje traje oko 10-ak minuta. 
                    </p>    
                    <br />                      
                    <h3></strong>IN CHARACTER</strong></h3>
                    <hr class="_hsync_login_box_hr">
                    <br/>
                    <table class="table" style="text-align: center;">               
                        <tr>
                            <td style="border-top: 0px;">Ime i prezime</td>
                            <td style="border-top: 0px; font-family: 'Noto Sans';">Ime_Prezime</td> 
                        </tr>
                        <tr>
                            <td style="border-top: 0px;">Starost</td>                           
                            <td style="border-top: 0px; font-family: 'Noto Sans';">16</td> 
                        </tr>
                        <tr>
                            <td style="border-top: 0px;">Spol</td>                          
                            <td style="border-top: 0px; font-family: 'Noto Sans';">Žensko</td> 
                        </tr>                               
                    </table>
                    <br />

                    <h3></strong>OUT OF CHARACTER</strong></h3>
                    <hr class="_hsync_login_box_hr">
                    <br/>                           
                    <table class="table" style="text-align: center;">               
                        <tr>
                            <td style="border-top: 0px;">Zaporka</td>                           
                            <td style="border-top: 0px;">&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;</td> 
                        </tr>
                        <tr>
                            <td style="border-top: 0px;">e-Mail adresa</td>                         
                            <td style="border-top: 0px; font-family: 'Noto Sans';">haswell.samp@hotmail.com</td> 
                        </tr>
                        <tr>
                            <td style="border-top: 0px;">e-Mail obavijesti</td>                         
                            <td style="border-top: 0px; font-family: 'Noto Sans';">Da</td> 
                        </tr>
                        <tr>
                            <td style="border-top: 0px;">Verifikacija</td>                          
                            <td style="border-top: 0px; color: green; font-family: 'Noto Sans';">Urađena</td> 
                        </tr>                                                                                                                               
                    </table>

                    <br />
                    <!-- UKOLIKO RAČUN PRVO TREBA PROĆI ODOBRENJE -->
                    <div class="alert alert-warning" role="alert">
                        <span class="glyphicon glyphicon-exclamation-sign"></span>Vaš račun prvo mora biti provjeren i odobren od strane administratora. Nakon provjere primiti ćete e-Mail s obavijesti o statusu računa.
                    </div>                                                                              
                </div>

我使用Bootstrap。这是一张图片 - http://i.imgur.com/7EQBHNQ.png

Answer 1

您可以使用<thead>和<tbody>作为您的表格在表格标题中，您可以定义每列的宽度。

http://www.w3schools.com/tags/tag_thead.asp

http://www.w3schools.com/tags/att_th_width.asp

Answer 2

我认为这是因为<td>标记的内容。要修复第二个设计，以便第二个表格得到第一个设计，你可以添加样式

<style type="text/css">
    tr td {
        width: 50%;
    }
</style>

表格不在中心| HTML＆amp; CSS

2 个答案: