it-swarm.dev

كيف تجعل واحد <td> يمتد كلا العمودين في جدول عمودين؟

click to see the image

كيف يمكنني إنشاء جدول مثل المثال أعلاه في HTML و CSS. لقد جربت ما يلي:

<table> 
  <tr> 
    <td style="width:50%">TEXT</td>
    <td style="width:50%">TEXT</td> 
  </tr>
  <tr> 
    <td style="width:100%">TEXT</td> 
  </tr>

لكنها لن تنجح. هل أستطيع مساعدتك؟

56
Ben Ben-Hamo

يجب عليك استخدام colspan للصف الثاني. مثله :

<table>
    <tr>
        <td style="width:50%">TEXT</td>
        <td style="width:50%">TEXT</td>
    </tr>
    <tr>
        <td colspan="2" style="width:100%">TEXT</td>
    </tr>
    ...
</table>

لمعرفة -> HTML Colspan

93
Aldi Unanto

<td>S لها سمة colspan التي تحدد عدد الأعمدة التي يجب أن تمتد عبرها. على سبيل المثال ، لديك عمودان يمتدان ، لذلك يبدو أن رمز التنظيف الخاص بك كما يلي:

<table>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
    <tr>
        <!-- The important part is here -->
        <td colspan="2">This will have 100% width by default</td>
    </tr>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
</table>
12
smilebomb