HTML tutoriál

HOME HTML Úvod do HTML HTML editory HTML Basic HTML prvky Atributy HTML HTML nadpisy HTML odstavce HTML styly Formátování HTML HTML citace HTML komentáře HTML barvy HTML CSS HTML odkazy HTML obrázky HTML favicon HTML tabulky HTML seznamy HTML Block & Inline HTML třídy ID HTML HTML iframe HTML JavaScript Cesty souboru HTML HTML hlava Rozložení HTML HTML responzivní Počítačový kód HTML Sémantika HTML Průvodce stylem HTML HTML entity HTML symboly HTML Emojis Znaková sada HTML HTML kódování URL HTML vs. XHTML

HTML formuláře

HTML formuláře Atributy formuláře HTML HTML prvky formuláře Typy vstupu HTML Vstupní atributy HTML Atributy vstupního formuláře HTML

HTML grafika

HTML plátno HTML SVG

HTML média

HTML média HTML video Zvuk HTML HTML pluginy HTML YouTube

HTML API

Geolokace HTML HTML Drag/Drop Webové úložiště HTML HTML Web Workers HTML SSE

Příklady HTML

Příklady HTML HTML kvíz HTML cvičení HTML certifikát HTML souhrn Přístupnost HTML

HTML reference

Seznam značek HTML Atributy HTML Globální atributy HTML Podpora HTML prohlížeče HTML události HTML barvy HTML plátno HTML Audio/Video HTML Doctypes HTML znakové sady HTML kódování URL HTML jazykové kódy Zprávy HTTP HTTP metody Převodník PX na EM Klávesové zkratky

Velikosti HTML tabulek


HTML tabulky mohou mít různé velikosti pro každý sloupec, řádek nebo celou tabulku.


     
     
     
     
     
     
     
     

Pomocí styleatributu s vlastnostmi widthnebo height zadejte velikost tabulky, řádku nebo sloupce.


Šířka tabulky HTML

Chcete-li nastavit šířku tabulky, přidejte style do prvku atribut <table>:

Příklad

Nastavte šířku tabulky na 100 %:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

Poznámka: Použití procenta jako jednotky velikosti pro šířku znamená, jak široký bude tento prvek ve srovnání s jeho nadřazeným prvkem, kterým je v tomto případě <body> prvek.


Šířka sloupce tabulky HTML

     
     
     

Chcete-li nastavit velikost konkrétního sloupce, přidejte style atribut na prvek <th>nebo :<td>

Příklad

Nastavte šířku prvního sloupce na 70 %:

<table style="width:100%">
  <tr>
    <th style="width:70%">Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>


Výška řádku HTML tabulky

     
     
     

Chcete-li nastavit výšku konkrétního řádku, přidejte style atribut na prvek řádku tabulky:

Příklad

Nastavte výšku druhého řádku na 200 pixelů:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

HTML cvičení

Otestujte se pomocí cvičení

Cvičení:

Použijte styly CSS, aby byla tabulka široká 300 pixelů.

<tabulka>
  <tr>
    <th>Křestní jméno</th>
    <th>Příjmení</th>
    <th>Body</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith< /td>
    <td>50</td>
  </tr>
</table>