Šírka obrázka v HTML
Štandardne sa obrázky zobrazujú v svojej
skutočnej veľkosti. Napríklad, ten obrázok
s úsmevom, ktorý sme zobrazovali vyššie, má
skutočnú veľkosť 130 na 130
pixelov a takú istú veľkosť obrázka vidíme
v prehliadači.
V prípade potreby je možné zmeniť veľkosť obrázka
nastavením jeho šírky. To sa robí pomocou atribútu
width.
Skúsme napríklad nastaviť nášmu obrázku
šírku 100 pixelov. Aby sme to urobili, hodnotou
atribútu width uvedieme číslo 100,
takto:
width="100"
Akej veľkosti bude obrázok na obrazovke?
Mohli by sme si myslieť, že nasledujúcej: šírka 100
pixelov, ako sme nastavili, a skutočná výška
130, pretože sme ju nenastavili. V
skutočnosti to tak nebude.
Šírka naozaj bude 100 pixelov,
ale výška sa prispôsobí tak, aby proporcie
obrázka neboli skreslené, teda bude tiež
100 pixelov.
Spustíme a presvedčíme sa o tom:
<img src="smile.png" width="100">
:
Nastavte vášmu obrázku šírku 300
pixelov.
