HTML lengoaia

Estekak eta irudiak

Esteka <a href=http://direccion-URL> testua </a> Irudia <img src=” irudi_fitxategia ” alt=” ordezko testua” >

Esteka txertatzeko bi datu behar dira gutxienez:

• Zer URL helbidetara joango den esteka gainean klik egitean ( href )

• Estekan ikusgai egongo den testua

Behar-beharrezkoa izango da esteka http:// siglekin hastea, eta estekan ikusgai dagoen testuak edukia identifikatzea; ez da komeni testu orokorrak jartzerik, adibidez, "egin klik hemen" erako testuak.

<a href ="http://es.wikipedia.org" > Entziklopedia askea </a>

Honela ikusiko da:

Entziklopedia askea

Irudien kasuan, online dagoen irudi baten URLa zehaztu behar da, baina komeni da gure guneetan dauden irudiak bakarrik erabiltzea, ezaba edo alda ez ditzaten.

Bestalde, beharrezkoa da erabiltzaile itsuentzat edo testurako bakarrik diren nabigatzaileak erabiltzen dituztenentzat irudiaren edukia testu bidez adieraztea:

< img src ="http://www.moodle3.hezkuntza.net/file.php/78/ranas.JPG" alt="igelak" />

Plataformara igo den irudi baten helbidea edo URLa jakiteko modurik praktikoena da irudia txertatzea ohiko metodoak erabilita (tresna-barrako Insertar imagen botoia erabilita), eta gero kodearen gainean lan egitea. Honako hauek alda ditzakezu, besteak beste:

• Irudiaren tamaina

  • Gehitu width="50%", irudiak pantailaren zabaleraren erdia har dezan, edo width="100%", irudiaren tamaina zabaldu eta pantaila osoa har dezan:

< img src ="http://www.moodle3.hezkuntza.net/file.php/78/ranas.JPG" alt="igelak" width="50%" />

< img src ="http://www.moodle3.hezkuntza.net/file.php/78/ranas.JPG" alt="igelak" width="100%" />

• Ertza

  • Gehitu border="1", irudiak pixel bateko lodierako ertza izan dezan, edo border="0" irudiak ertzik izan ez dezan:

< img src ="http://www.moodle3.hezkuntza.net/file.php/78/ranas.JPG" alt="igelak" border="1" />

< img src ="http://www.moodle3.hezkuntza.net/file.php/78/ranas.JPG" alt="igelak" border="0" />

• Lerrokatzea

  • Irudia eskuinean lerrokatuta egon dadin, "eskuin-lerrokadura" estiloa duen dibisio (div) bat sortu beharko duzu, eta irudia DIV horretan sartu:

<div style="text-align: right;"> <img src="….."> </div>

• Irudiak eskuin-lerrokadura izan dezan, eta irudiaren ondorengo testua ezkerrean gera dadin, "eskuinean mugikor" estiloa duen DIV bat sortu beharko duzu:

<div style="float: right;"> <img src="….."> </div>

<div style="text-align: right;"> <img src="….."> </div>	<div style="float: right;"> <img src="….."> </div>

• Irudia ezkerrean lerrokatzea edo ezkerrean mugikor egotea nahi baduzu, erabili "left":

  • <div style="text-align: left;"> <img src="….."> </div>

  • <div style="text-align: left;"> <img src="….."> </div>

• Erdian egoteko, berriz, idatzi: “center”:
  
  
  • <div style="text-align: center;"> <img src="….."> </div>