kasis :: HTML noformējums

Sākumlapa
"Pirmā web lapa"
CSS
Citi materiāli

Ceļošana - kalni

HTML

Sintakse
Pamatelementi
Virsraksti, rindkopas
Saraksti
Saites
Attēli
Tabulas
Noformējums
Meta

HTML ...
Doctype
Rakstāmzīmju kodējums
Entītijas
Valodas norādīšana
Teksta virziens

Vēl iesaku:

Mazliet noformējuma

Kā jau sākumā minēju, tad HTML elementu noformējumam vēlams lietot CSS. Taču arī HTML4.01 ir iekļauti atsevišķi noformējuma tagi.
Un tomēr atgādināšu vēlreiz - pirms nopietni sākat veidot HTML lapas, noteikti apgūstiet CSS!!!

Lietojot zemāk minētos tagus, jāņem vērā, ka tie ne vienmēr korekti tiek attēloti visās pārlūkprogrammās. Es tos notestēju uz "Internet Explorer 6.0.29" (IE), "Opera 9.01" (Op) un "FireFox 1.5.0.6" (FF). Zaļa krāsa nozīmē, ka pārlūkprogramma doto tagu atbalsta, dzeltena - atbalsta, bet, manuprāt, nav līdz galam nostrādāts, sarkana - neatbalsta.
Parasti vēlamais teksts tiek vienkārši ierakstīts starp tagiem, bet ar zvaigznīti (*) atzīmēti tie tagi, kuru pierakstā ir kādas īpatnības un to kodu piemēri doti zemāk.

īpašība vai tags	nozīme	IE	FF	Op
<abbr></abbr>*	abreviatūras definēšana, piemēram: ASV
<acronym></acronym>*	akronīma definēšana, piemēram: LOL
<address></adress>	pasta un tml. adreses pieraksts, piemēram: Jānis Tautujānis "Lefkojas" Pākšu pagasts
<b></b>	treknraksts
<bdo></bdo>*	teksta (tabulu) virziena definēšana. Nāksies lietot atribūtu "dir" ar iespējamajām vērtībām "ltr" (left-to-right, noklusētā vērtība) un "rtl" (right-to-left), piemēram: mainīts virziens
<big></big>	visi burti nu ir lielāki
<blockquote> </blockquote>	Gara citāta definējums, piemēram: Kāds students reiz teica: Citēt vajag mācēt, citēt vajag spēt, beigās savu murgu, citam iesmērēt! Tomēr pasniedzēji ar nav vakarējie.. :(
<cite></cite>	Definē citātu, piemēram: Šis ir citāts
<code></code>	`teksts atgādina datorkodu`
<del></del>	uzrāda vēlāk dzēstu tekstu, piemēram: iešu uz veikalu~~, bet pirms tam ieskriešu kafenē~~ un tad atpakaļ.
<dfn></dfn>	Definīcijas definēšana, piemēram: kaķis - četrkājains, pret cilvēkiem iecietīgs zvērs
<em></em>	uzsvērtais teksts (emphasized)
<i></i>	slīpraksts
<ins></ins>	uzrāda vēlāk pievienotu tekstu, piemēram: iešu uz veikalu, bet pirms tam ieskriešu kafenē un tad atpakaļ.
<kbd></kbd>	`klaviatūras (keyboard) veida teksts`
<pre></pre>*	nenoformēts teksts - teksts tiks attēlots tieši tāds, kādu uzrakstīsim, ņemot vērā visas atstarpes, atkāpes, pārejas uz jaunu rindkopu ("Enterus") utml.
<q></q>	īss citāts (quotation), piemēram: Kāds students reiz teica: Pietiek zubrīt, gribas ēst!
<samp></samp>	`datora paraug-, jeb nolases kods (sample)`
<small></small>	sīks teksts
<strong></strong>	Izceltāks, treknāks teksts
<sub></sub>	apakšraksts, piemēram: O₂
<sup></sup>	augšraksts, piemēram: x²
<tt></tt>	`teletaipa veida teksts`
<var></var>	`mainīgā (variable) attēlošana`
<br>*	nav atsevišķa noslēdzošā taga. Identisks MS Word taustiņiem "Shift+Enter" - pāreja uz jaunu rindiņu
<hr>*	nav atsevišķa noslēdzošā taga. Uzzīmē horizontālu līniju ar atsarpi virs un zem līnijas

Sākumā šķiet, ka daudziem noformējumu tagiem ir līdzīgs rezultāts. Tad kāda ir jēga!? Runa iet par pareizas jeb ērtas lapas struktūras veidošanu. To, šķiet, būs lemts izprast tikai tiem, kas apgūs arī CSS. Piemēram, ja mēs veidotu mācību materiālu par kādu programmēšanas valodu, sniedzot daudz koda piemēru, tad tikai ar pāris rindiņām CSS koda visam tekstam mūsu materiālā, kas iekļauts <code></code> tagos, mēs varētu piešķirt zilu krāsu, bet mainīgajiem starp <var></var> tagiem - dzeltenu!

Piemēri

HTML kods (pieņemot, ka pirmo divu līmeņu virsraksti jau bijuši mūsu lapā kaut kur iepriekš..):

<h3>Saīsinājumi</h3><br>
<p>Kā jau daudz citu datorpasaules jēdzienu, arī saīsinājums <acronym title="skaļi smieties">LOL</acronym>, šķiet, cēlies <abbr title="Amerikas Savienotajās Valstīs">ASV</abbr>.<br>
Teksta (tabulu) attēlošana pretējā virzienā: <bdo dir="rtl">Čau!</bdo></p>
<hr>

<h3>Nenoformēts teksts un pat kāda ASCII māksliņa :)</h3>
<pre>

Uhu,   kāc     baigs
varianc!!   Ko        tik te
         nevar!

             _______
       o    /_______\                         asTTcn   
      /T\   |       |                        ifttid3A  
       A    |_______|      ..un vēl..       ii( )u( )m 
                                            i9yt/ \t67 
                                             i95 _ 57  
                                           sd iyi=tyi hz    
                                         rrs3s rgggr zj54 
                                        iokcjkl     nhishj
                                        1ops\ ojojii7 /4hj

</pre>
<hr>
<p>Lūk, kā esam paķēpājušies :)      <sup>:)</sup> kasis</p>

Rezultāts:

Saīsinājumi

Kā jau daudz citu datorpasaules jēdzienu, arī saīsinājums LOL, šķiet, cēlies ASV.
Teksta (tabulu) attēlošana pretējā virzienā: Čau!

Nenoformēts teksts un pat kāda ASCII māksliņa :)

Uhu,   kāc     baigs
varianc!!   Ko        tik te
         nevar!


             _______
       o    /_______\                         asTTcn
      /T\   |       |                        ifttid3A
       A    |_______|      ..un vēl..       ii( )u( )m
                                            i9yt/ \t67
                                             i95 _ 57
                                           sd iyi=ty hz
                                         rrs3s rgggr zj54
                                        iokcjkl     nhishj
                                        1ops\ ojojii7 /4hj

Lūk, kā esam paķēpājušies :) ^:) kasis

<< Atpakaļ

Tālāk >>