Følgende html-kommando gjelder om du vil ha et bilde på web-siden:
<img src=”URL”>
Html-merket img står for image (bilde), attributten src for source (kilde) og URL er bildets adresse.
Det er også mulig å legge til en alternativ tekst med attributtet alt=”tekst” i tilfelle bildet skulle utebli.
.
| Html-kommando: | I nettleseren: |
|
<img src=”URL” alt=”Salamander”> |
.
Diverse bruksområder
| <a href=”URL”> <img src=”URL”></a> |
->bildet brukt som peker (til et annet bilde eller en annen web-side). |
| <body background=”URL”> | ->bildet brukt som sidens bakgrunnsbilde. |
.
Attributter
| alt=”Alternativ tekst” | ->alternativ tekst i tilfelle nettleseren ikke klarer å laste ned bildet. |
| border=”2″ | ->rammer inn bildet/grafikken. |
| align=”left”/”center”/”right” | ->justerer bildet på skjermen. |
.
Miniatyrbilde med lenke til originalen:
Det er også mulig å ha et miniatyrbilde som en kan klikke på for å få se originalen.
En bildelink er omgitt av en ramme slik som på miniatyrbildet under.
<a href=”URL til originalbildet”>
<img src=”URL til miniatyrbildet”></a>
.
Justere bildets størrelse og bildeteksten
| width=”" | Justerer bredden |
| height=”" | Justerer høyden |
| align=”top/middle/bottom” | Justerer tittelen ifht bildet (kun en linje) |
| align=”left/right” | Preiserer hvilken side bildet skal stå på ifht teksten |
| border=”15″ | Rammer inn bildet |
.
| Originalbildet: | Forminsket bilde: |
| <img src=”URL”> | <img src=”URL” width=”150″ align=”right”>Tekst |
 |
 Venezia Venezia Venezia Venezia Venezia |
.
En kan også midtstille et bilde i et avsnitt, men da må align=”center” stå inni avsnittsmerket:
<p align=”center”>
<img border=”15″ src=”URL”>
Tekst</p>
Vannliljer
.
Noen bildeformater det er greit å kjenne til:
- JPEG (Joint Photographic Experts Group): svært nært originalen, flere millioner farger er tilgjengelige.
- GIF (Graphic Interchange Format): begrenset til 256 farger, passer fint til tegninger og logo.
- PNG (Portable Network Graphics): et spesialformat beregnet på web-sider, lettere en GIF.
0 Svar til “6. Bilder”