Handleiding HTML Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin

Inhoud onderdeel: Introductie afbeeldingen | Opnemen afbeelding | Rand om afbeelding | Verticaal uitlijnen afbeelding | Horizontaal uitlijnen afbeelding | Ruimte rond de afbeelding | Omschrijving in tooltip | Speciale functie afbeelding | Image maps | Client-side image maps | Voorbeelden image maps | Tooltips voor image maps

Gerelateerde elementen: AREA | IMG | MAP

Rand om afbeelding

Het BORDER attribuut gebruik je om de dikte van de rand om de afbeelding op te geven.

<IMG SRC="usa1.gif" WIDTH="140" HEIGHT="100" BORDER="3" ALT="Foto Monument Valley">

Wanneer je een afbeelding in een hyperlink opneemt, dan plaatsen sommige browsers er automatisch een rand om. Wanneer je dit niet wilt, dan neem je het BORDER attribuut op met de waarde "0".

<A HREF="usa3.gif"><IMG SRC="usa2.gif" ALT="Foto Monument Valley" WIDTH="150" HEIGHT="102" BORDER="0" ></A>

Ook met een stijl kun je bepalen of er een rand om de afbeelding geplaatst moet worden en in welke dikte, vorm en kleur. Dat kan met behulp van de eigenschappen voor randen. In het volgende voorbeeld is met een inline stijl vastgelegd dat er een rode rand van 2 pixels om de afbeelding moet staan.

<P><IMG SRC="gezicht.gif" ALT="Foto gezicht" WIDTH="105" HEIGHT="125" STYLE="border: solid 2px red;"></P>

Rechts is de weergave door de browser te zien en links een schermafdruk van de bedoelde weergave.

Om de rand weg te laten bij afbeeldingen die in een hyperlink zijn opgenomen, gebruik je de waarde none voor de border-style eigenschap

<A HREF="usa3.gif"><IMG SRC="usa2.gif" ALT="Foto Monument Valley" WIDTH="150" HEIGHT="102" STYLE="border-style: none;"></A>

Vervolg: Verticaal uitlijnen afbeelding

Inhoud onderdeel | Inhoud HTML | Inhoud CSS | Trefwoordenregister | Begin

Handleiding HTML (https://www.handleidinghtml.nl/)
Copyright © 1995-2024 Hans de Jong
Laatste wijziging: 15 juni 2024