In de hypertext opmaaktaal (HTML) wordt een speciaal commando "tag" gebruikt om een afbeelding op een pagina weer te geven. Deze tag wordt img genoemd en bevat een reeks variabelen - "attributen". Met behulp van attributen kunt u alle aspecten van de weergave van een afbeelding op een hypertextpagina bepalen, inclusief de afmetingen. Dit is echter niet de enige manier om het probleem op te lossen - u kunt de afbeelding ook verkleinen met Cascading Style Sheets (CSS).
instructies:
Stap 1
Plaats de attributen height en width in de tag die verantwoordelijk is voor het weergeven van de gewenste afbeelding. Stel de eerste in op de verticale grootte van de afbeelding en de tweede op horizontaal. Zet beide getallen in pixels, maar het is niet nodig om hier eenheden - px - aan te geven. Let bij het berekenen van de benodigde waarden voor deze attributen op de naleving van de verhoudingen van de verkleining van de afbeelding, anders wordt deze in een vervormde vorm weergegeven. Om bijvoorbeeld een gehalveerde afbeelding in een pagina te plaatsen uit een bestand genaamd SomePic.jpg, waarvan de initiële afmetingen 500 bij 300 pixels zijn, kan de tag worden gedaan met de volgende opdracht:
Stap 2
U kunt de proportionele reductie van de originele afbeeldingsafmetingen in procenten instellen. Gebruik hiervoor alleen het kenmerk height zonder de breedte op te geven en voeg een procentteken toe na het opgeven van het maatbepalende getal. U kunt bijvoorbeeld hetzelfde effect bereiken als in het voorbeeld van de vorige stap met een tag die in deze vorm is geschreven:
Stap 3
Als u de grootte van de afbeelding wilt specificeren met behulp van de beschrijving van stijlen, gebruikt u dezelfde tagnaam - img - en de attributen - breedte en hoogte. In dit geval moeten de meeteenheden - px, pt of% - altijd worden opgegeven. Om de halvering van de grootte van absoluut alle afbeeldingen op de pagina in te stellen, plaatst u het volgende item in het stijlbeschrijvingsblok: img {height: 50%;} Als u de grootte van slechts één afbeelding wilt verkleinen, voegt u een extra id-kenmerk toe aan zijn tag en wijs er een unieke aan toe voor de afbeeldingen van deze paginawaarde - bijvoorbeeld PicOne: voeg dezelfde waarde toe aan de stijlrecord, scheid deze met een "hash" # van de tagnaam. De volledige stijlbeschrijving kan er in dit geval als volgt uitzien: img # OnePic {hoogte: 50%;}
