3. praktikumi materjalid

Täpitähtede kuvamine, väljakommenteerimine. Linkide tüübid: tekstisisesed lingid, lingid teistele HTML-dokumentidele, lingid e-posti aadressidele; erinevate lehitsejate kasutamine. Lihtsamate tabelite loomine. Youtube'i ja Vimeo videote embedimine.

3. praktikumi ülesanded

Täpitähtede kuvamine

Et kõik kasutajad näeksid täpitähti korrektselt, on üks võimalus lisada selline rida:
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

HTML-dokumendi struktuuris näeb see välja nii:

<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>Pealkiri, mis on näha dokumendi päises</title>
</head>
<body>

Lehekülje sisu, sh ka tekstide pealkirjad

</body>
</html>

Väljakommenteerimine

Kui on soov lisada dokumenti enda jaoks selgitavaid kommentaare, saab seda teha järgmiselt:

<!-- Kirjuta kommentaarid siia -->

Linkide tüübid

Lingid teistele HTML-failidele

Teistele failidele linkimine on lihtne siis, kui need asuvad samas kataloogis. Sellisel juhul tuleb näidata vaid faili nimi: <A HREF="kala.html">Kalad</A>

Kui fail asub alamkataloogis, siis tuleb näidata ka alamkataloogi nimi:
<A HREF="failid/kala.html">Kalad</A>

Lingid teistele kodulehekülgedele

<A HREF="http://www.ut.ee/">Tartu Ülikool</A>

Alamlehtedele linkides on korrektne kasutada vastava alamlehe aadressi:
<A HREF="http://web.zone.ee/heids/kala.html">Kalad</A>

Et lingile vajutades avaneks leht uues aknas, tuleb lisada target=_blank:
<A HREF="http://www.ut.ee/" target="_blank">Tartu Ülikool</A>

Lingid e-posti aadressidele

Tehniliselt käib linkide lisamine e-posti aadressidele järgmiselt:

Praktiliselt kasutada aga ei soovita, kuna e-posti aadress on kodulehel kerge saak spämmirobotitele. E-posti aadresside lisamisel kodulehele ei ole soovitatav kasutada ka @-märki, vaid lisada aadress näiteks kujul kala [ät] gmail.com.

Tekstisisesed lingid

Link sama faili osale
<A NAME="kala"> tekst, kuhu lingile vajutades peaks jõudma </A>
<A HREF="#kala">lingi nimi</A>

Link teise faili osale
<A NAME="kala">tekst, kuhu lingile vajutades peaks jõudma</A>
<A HREF="kala.html#kala">lingi nimi</A>

Linkide värv

<body link="red">
<A style="color:red" href="http://www.ut.ee/">Lingi nimi </A>

Lihtsamate tabelite loomine

<TABLE BORDER="2" STYLE="width:100%" >
<TR>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
</TABLE>

<TABLE> - tabel
<TR> - rida
<TD> - lahter

Videote embedimine

Youtube’i video embedimine
<IFRAME src="http://www.youtube.com/embed/vL9ZnBy4yng" frameborder="0" width="600" height="337" allowfullscreen></IFRAME>

Vimeo video embedimine
<iframe src="https://player.vimeo.com/video/xxx" width="600" height="337" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

3. praktikumi ülesanded