HTML Afbeeldingen

HTML <img> height attribuut

  • Het height attribuut specificeert de hoogte van een afbeelding.
  • De waarde kan uitgedrukt worden in pixels, of als percentage van de beschikbare hoogte.

Attribuut voorbeeld

<html>
<body>
<img alt="logo" src="html-totaal.png" height="100" width="250" border="1">
</body>
</html>
logo

Verschil HTML - XHTML

Het img element moet correct worden afgesloten in XHTML.

naar boven 

tip

Het is een goede gewoonte om steeds de hoogte en de breedte van een afbeelding te specificeren.

Wanneer niet gelijktijdig het width attribuut is opgenomen, wordt de breedte in dezelfde verhouding als de hoogte gewijzigd.

  • Wanneer deze attributen voorhanden zijn kan de benodigde ruimte voor de afbeelding worden gereserveerd.
  • Bij het ontbreken van de afmetingen zal de layout van de pagina steeds wijzigen tijdens het downloaden van de afbeelding !

Attribuut waarde

Waarde Beschrijving
pixels De hoogte van de afbeelding in pixels.
% De hoogte van de afbeelding in percentage van de beschikbare hoogte in het element.

naar boven 

nota

Internet Explorer ondersteunt geen percentage voor de hoogte.
De hoogte wordt berekend vanuit de breedte, waarbij de oorspronkelijke hoogte/breedte verhouding wordt aangehouden !

tip

Het verkleinen van een grote afbeelding dmv de width en height attributen, dwingt de bezoeker de grote afbeelding te downloaden (ook al wordt ze klein getoond in de browser) !

  • Gebruik een resizer (herschaal) programma vooraleer de afbeelding op uw pagina te plaatsen !

Opbouw

<img src="url" height="px of %" width="px of %"> In HTML
<img src="url" height="px of %" width="px of %" /> In XHTML
tip

Ook met CSS kunnen de afmetingen van een afbeelding gespecificeert worden !

Browser ondersteuning

Internet Explorer Firefox Chrome Opera Safari

  • Het <img> height attribuut wordt ondersteunt in de bekende browsers.
naar boven naar boven naar width attribuut
naar boven naar het width attribuut