HTML/Tekstilõigud ja reavahetused

Allikas: Vikiõpikud
Jump to navigation Jump to search

Kaduma läinud reavahetused ja tühikud[muuda]

Tavalist, ilma mingite lisailustustega teksti võib veebilehele sisuliselt kirjutada ilma mingeid märgendeid lisamata - enamik veebilehitsejaid suudab seda mõista (muidugi tähendab selline toimine vilistamist kõigi standardite peale). Tuleb aga silmas pidada, et lehekülje lugemisel ei arvestata ühtegi sisestamisel Enter-klahviga tehtud reavahetust - seda selleks, et kindlustada teksti paindlik kujundamine brauseris (lugemisakna suurendamisel või vähendamisel paigutub aknas olev tekst vastavalt akna uutele mõõtudele automaatselt ringi).

Lisaks reavahetustele ei näidata ka tühikuid päris nii nagu lähtekoodis. Mitu kõrvutiasuvat tühikut loetakse alati üheks (on ka üks erand, millest tuleb juttu allpool). Ka HTML-is olevad reavahetused loetakse tühikuteks. Näiteks, kui kirjutame HTML-faili järgmise teksti:

    Juku ja Mari mängisid õues palli.
Nad olid sellest mängust nii hõivatud,
et ei märganudki, et väljas oli juba
pimedaks läinud.

    Oli saabunud õhtu, ja paljud öösel
elutsevad loomadki olid hakanud oma
sügavatest urgudest maapinnale ronima.
Ent Juku ja Mari ei märganud seda veel.

Kuid kui vaatame seda brauseris, siis on kõik meie taandread kaduma läinud, ning kaks väikest tekstilõiku on sulandunud üheks pikaks lõiguks:

Juku ja Mari mängisid õues palli. Nad olid sellest mängust nii hõivatud, et ei märganudki, et väljas oli juba pimedaks läinud. Oli saabunud õhtu, ja paljud öösel elutsevad loomadki olid hakanud oma sügavatest urgudest maapinnale ronima. Ent Juku ja Mari ei märganud seda veel.

Tekstilõigud[muuda]

HTML-is tähistatakse uut lõiku p-elemendiga (paragraph). Iga lõigu algusesse kirjutatakse <p> ja lõppu </p>:

<p>Juku ja Mari mängisid õues palli.
Nad olid sellest mängust nii hõivatud,
et ei märganudki, et väljas oli juba
pimedaks läinud.</p>

<p>Oli saabunud õhtu, ja paljud öösel
elutsevad loomadki olid hakanud oma
sügavatest urgudest maapinnale ronima.
Ent Juku ja Mari ei märganud seda veel.</p>

Kui raamatutes ja käsikirjas alustatakse uut lõiku taandreaga, siis arvutiekraanilt loetava teksti puhul eristatakse lõigud suurema reavahega:

Juku ja Mari mängisid õues palli. Nad olid sellest mängust nii hõivatud, et ei märganudki, et väljas oli juba pimedaks läinud.

Oli saabunud õhtu, ja paljud öösel elutsevad loomadki olid hakanud oma sügavatest urgudest maapinnale ronima. Ent Juku ja Mari ei märganud seda veel.

Selliselt vormistatud teksti on ekraanilt märksa mugavam lugeda kui sellist, kus on kasutatud taandridu - ent mis siis, kui me ikkagi sooviks lõike eraldada taandreaga?

Sellisel puhul tulevad meile appi stiililehed, mis lubavad mugavalt määrata, kuidas üks või teine HTML-i element brauseris välja peab nägema. Näiteks järgnev stiilideklaratsioon määrab, et kõik HTML-faili tekstilõigud peavad algama taandreaga ning mitte kasutama tühja ruumi enda ees ja järel:

p {
    text-indent: 2em;
    margin-top: 0;
    margin-bottom: 0;
}

Juku ja Mari mängisid õues palli. Nad olid sellest mängust nii hõivatud, et ei märganudki, et väljas oli juba pimedaks läinud.

Oli saabunud õhtu, ja paljud öösel elutsevad loomadki olid hakanud oma sügavatest urgudest maapinnale ronima. Ent Juku ja Mari ei märganud seda veel.

Stiililehtede kasutamise kohta leiad lisainfot vikiraamatukogu CSS-i raamatust.

Reavahetused[muuda]

Kui soovime tekstis kasutada kindlaksmääratud reavahetust, tuleb see panna paika br-elemendiga (tuleneb sõnast break - murdekoht, katkestus). Näiteks:

Kogu see lause paistab brauseri suures aknas lugedes ühe pika lausena kuni siiani,<br />
see tekst aga on uuel real.

Siin näeme jällegi üht olulist muutust, mille XHTML on kaasa toonud. Varasemas HTMLis piisas katkestuse tegemiseks üksikust br-märgendist, nüüd aga on kõik märgendid paaris. Et aga selle ja veel mõne teise tühja märgendipaari kasutamisel tööd kokku hoida, on loodud alternatiivne esitus ehk lühikuju:

<br></br>  =>  <br />

Tähelepanu - kaldkriipsu ees on tühik! See säästab vanemaid brausereid, mis XHTMLi ei tunne, "lolliks minemisest" - tühik võimaldab neil järgnevat kaldkriipsu ignoreerida ja tõlgendada märgendit veidi vigase, kuid siiski loetava "vana HTML-i" märgendina.

Kuid ettevaatust! Reavahetuste kasutamisega tasub olla konservatiivne. Enamikel juhtudel tuleks kasutada teisti HTML-i elemente, millele saab stiililehtedega määrata teistsuguse välimuse, kui see neil vaikimisi on.

Õigupoolest on vaid paar üldtuntud juhtu, kus reavahetuse kasutamine õigustatud on:

  • luuletused ja
  • aadressid.

Näiteks:

<p>Haapsalu 90550,<br />
Tallinna mnt. 8-12,<br />
Juhan Juurikas.</p>

Eelvormindatud tekst[muuda]

Vahel tuleb siiski tekst esitada fikseeritud kujul - näiteks arvutiprogrammi kood või mõni moodsam luuletus. Siis on kõige käepärasem kasutada pre - märgendipaari (preformatted ehk eelvormindatud), mille vahel olev tekst kuvatakse täpselt selliselt, nagu ta on sisestatud. Enamasti näitavad veebilehitsejad pre-teksti teistsuguses kirjastiilis kui tavalist teksti - levinuim on Courier-font. Enamiku luuletuste puhul pole tarvis enamat, kui lihtsalt reavahetusi õigetes kohtades - sellisel juhul tuleks kasutada br elementi. Kui aga oluline on ka see, kui palju tühja ruumi sõnade vahele jäetakse jms, siis on vast sobilikum pre:

<h1>Artur Alliksaar</h1>

<h2>Käidi ja külvati varjude seemneid, sest valgus hakkas võrsuma</h2>

<pre>Saad korra rüübata,
                    kui algab lahtumine.
Käest
      puruks kukub
                   kilgendav kristall.
Saad vaevalt süttida, 
                      kui algab jahtumine,
ja uhmjat udu 
              ujub pahinal.
Hing kaugust kirgab veel, 
                          kui algab ahtumine
ja piksed pimenevad 
                    kahinal.
See, mis meid ligindab, 
                        on lahkumine.
Öö. 
    Uni. 
         Õli vaikib tahi all.
Et elujõud on 
              ulmamahtumine,
ei enam 
        meelde tulegi vist tal...</pre>