Učíme sa HTML časť 25: Použitie atribútov šírky a výšky v tabuľkách HTML
Pre tých z vás, ktorí už predtým študovali učebný materiál HTML, ste samozrejme oboznámení s atribútmi šírky a výšky.
Aplikácia týchto dvoch atribútov sa neobmedzuje iba na tabuľky HTML, ale používa sa tiež na nastavenie veľkosti obsahu v HTML, ako sú obrázky.
Pre tých z vás, ktorí stále nechápu, ako to dosiahnuťTabuľky HTML a atribúty bežne používané v tabuľkách HTML si môžete preštudovať predchádzajúce články, aby ste lepšie porozumeli, než budete pokračovať v tomto článku.
Všeobecne platí, že použitie atribútov šírka a výškaznačka <table> je podporovaná iba pomocou HTML4.01, ale nie je podporovaná HTML5. Aj tak by ste však mali vedieť, ako používať oba atribúty v značke <table> ako učenie. Teraz, pre viac informácií o tom, ako používať tieto dva atribúty, sa pozrime na nižšie uvedené vysvetlenie.
Atribút šírky
Atribút width v tabuľke sa používa preurčiť šírku tabuľky. Ak nenastavíte šírku tabuľky pomocou atribútu width, šírka tabuľky sa bude zhodovať so šírkou potrebnou na zobrazenie údajov. Syntax atribútu width je:
<table width="pixel atau %">
V atribúte width sú dve hodnoty, ktoré možno použiť, a to:
hodnota | funkcie |
pixel (px) | Nastavte šírku v pixloch, napríklad: iba 400 pixlov alebo 400 pixlov |
percento (%) | Nastavte šírku v percentách prvkov okolo, napríklad: 30% |
Nasleduje príklad kódu na písanie a použitie atribútu width v HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Width di HTML</title>
</head>
<body>
<table width="400" border="2">
<tr>
<th width="50">No</th>
<th>NIM</th>
<th>Nama</th>
</tr>
<tr>
<td align="center">1</td>
<td>071401001</td>
<td>Ridayanti</td>
</tr>
<tr>
<td align="center">2</td>
<td>071401002</td>
<td>Ahmad Zulham</td>
</tr>
<tr>
<td align="center">3</td>
<td>071401003</td>
<td>Zulaikha</td>
</tr>
</table>
</body>
</html>
Po vykonaní vyššie uvedeného kódu v prehliadači sa zobrazí nasledujúci obrázok:
Atribút výšky
Atribút výšky v tabuľke sa používa preurčiť výšku stola. Rovnako ako v prípade atribútu width, ak nenastavíte výšku tabuľky pomocou atribútu height, potom sa výška tabuľky bude zhodovať s výškou potrebnou na zobrazenie údajov. Syntax atribútu height je:
<table height="pixel atau %">
V atribúte height sú dve hodnoty, ktoré možno použiť, a to:
hodnota | funkcie |
pixel (px) | Nastavte šírku v pixeloch, napríklad: 150 pixlov alebo 150 pixlov |
percento (%) | Nastavte šírku v percentách okolitých prvkov, napríklad: 10% |
Tu je príklad písania kódu a použitia atribútu height v HTML:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Atribut Height di HTML</title>
</head>
<body>
<table border="2" height="150">
<tr>
<th width="50">No</th>
<th>NIM</th>
<th>Nama</th>
</tr>
<tr>
<td align="center">1</td>
<td>071401001</td>
<td>Ridayanti</td>
</tr>
<tr>
<td align="center">2</td>
<td>071401002</td>
<td>Ahmad Zulham</td>
</tr>
<tr>
<td align="center">3</td>
<td>071401003</td>
<td>Zulaikha</td>
</tr>
</table>
</body>
</html>
Po vykonaní vyššie uvedeného kódu v prehliadači sa zobrazí nasledujúci obrázok:
Pretože HTML5 tieto dva atribúty nepodporuje, odporúča sa použiť nastavenie CSS v nastaveniach šírky a výšky tabuľky. Syntax šírky a výšky v CSS je:
<table style="width:400px; height:150px;">
To je všetok materiál na použitie atribútov šírka a výška v tabuľkách v HTML, dúfajme, že vyššie uvedenému materiálu dobre rozumiete.