Besedilo v urejevalniku zapišemo kot zaporedje znakov, pri čemer ni pomembno, kako razlamljamo vrstice ter koliko presledkov in tabulatorjev pišemo med besedami. Brskalniki vse tabulatorje in znake za novo vrstico obravnavajo kot presledke, več zaporednih presledkov pa obravnavajo kot enega samega. Brskalnik bo skok v novo vrsto naredil šele, ko mu bo zmanjkalo prostora v tekoči vrstici. Zaradi tega lahko besedilo v brskalniku izgleda popolnoma drugače kot smo ga zapisali v datoteki HTML.
Besedilo lahko pišemo v naslovih, odstavkih, seznamih in tabelah, ne smemo pa ga pisati neposredno v telo dokumenta (body).
Na voljo imamo več nivojev naslovov. Za naslove uporabljamo elemente h1 (glavni naslov), h2 (podnaslov), h3, h4 h5 in h6. Nad in pod vsakim naslovom brskalnik pusti nekaj prostora, izpiše jih krepko, velikost pisave pa je odvisna od nivoja.
<h1> Naslov na 1. nivoju </h1> <h2> Naslov na 2. nivoju </h2> <h3> Naslov na 3. nivoju </h3> <h4> Naslov na 4. nivoju </h4> <h5> Naslov na 5. nivoju </h5> <h6> Naslov na 6. nivoju </h6>
Poznamo tudi več vrst odstavkov. Osnovni element za odstavke je div. Ta poskrbi, da se besedilo prične na začetku nove vrstice, drugih oblikovnih učinkov pa nima. Največkrat uporabljamo element p, ki pusti še nekaj prostora nad in pod ostavkom. Kot poseben odstavek omenimo še element address, ki ga običajno uporabljamo na koncu dokumenta za navedbo podatkov o avtorju. Vso besedilo izpiše nagnjeno. Koristen je tudi element hr, ki ga lahko obravnavamo kot odstavek brez vsebine. Nariše vodoravno črto.
<hr /> <div> Osnovni odstavek </div> <hr /> <p> Navaden odstavek </p> <hr /> <address> Podatki o avtorju </address> <hr />
Če želimo, da bo brskalnik skočil v novo vrsto na točno določenem mestu, lahko to zahtevamo z elementom br na tistem mestu, kjer naj naredi prelom vrstice.
Če pa želimo ohraniti razlome vrstic, kot jih naredimo v urejevalniku, si pomagamo z elementom pre. To je posebna vrsta odstavka, kjer so vsi presledki, tabulatorji in znaki za novo vrstico pomembni. Znotraj tega elementa brskalnik ne naredi preloma, ko mu zmanjka prostora v tekoči vrstici. Stranski učinek tega elementa je uporaba pisave, kjer so vsi znaki enake širine. V spodnjem primeru vidimo, da brskalnik upošteva tudi vse presledke, ki jih napišemo na začetku vrstice.
<p> To je odstavek, <br /> v katerem smo ročno <br /> naredili nekaj prelomov vrstic. </p> <pre> To pa je odstavek, v katerem so prelomi vrstic in presledki med besedami pomembni. </pre>
Poglavje zase so tudi prelomi vrstic na mestih, kjer ne bi smeli biti. Oglejmo si primer številskega podatka z enoto, ki ga običajno pišemo s presledkom med številko in enoto, na primer 10 cm. Če bi vmes zapisali navaden presledek (kot v prejšnjem stavku), se lahko zgodi, da bo brskalnik ravno tam naredil prelom vrstice, kar ne bi izgledalo nič kaj lepo. Rešitev je v uporabi posebnega presledka, ki mu rečemo trdi presledek. Čeprav se izpiše kot navaden presledek, se obnaša kot črka, torej bo brskalnik prepričan, da je 10 cm ena sama beseda, in vmes ne bo naredil preloma. Kako napišemo trdi presledek, je pokazano spodaj v poglavju o posebnih znakih.
Kadar želimo enega ali več bločnih elementov (odstavkov, naslovov ali seznamov) prikazati ožje (z odmikom od levega in desnega roba), lahko uporabimo element blockquote. Ta je sicer namenjen pisanju daljših citatov, ki pa jih brskalniki prikažejo odmaknjene od obeh robov.
<h1> Navaden naslov </h1> <p> Navaden odstavek </p> <blockquote> <h2> Podnaslov z odmikom </h2> <p> Odstavek z odmikom </p> </blockquote> <p> Še en navaden odstavek </p>
Nekateri znaki v HTML imajo poseben pomen. Ti znaki so < (manjši), > (večji), " (dvojni narekovaj) in & (in). Če jih želimo uporabiti v besedilu, moramo uporabiti njihova imena, določena s standardom SGML, na primer takole:
| opis | znak |
|---|---|
| < | < |
| > | > |
| " | " |
| & | & |
Obstajajo tudi znaki, ki bi jih želeli vključiti na spletno stran, a jih nimamo na tipkovnici. Tudi v takih primerih uporabimo imena znakov, določena s standardom SGML. Naštejmo samo nekatere takšne znake:
| opis | znak |
|---|---|
| | trdi presledek |
| © | © |
| ö | ö |
Če imena znaka ne poznamo, lahko namesto imena napišemo tudi njegovo desetiško ali šestnajstiško kodo iz tabele Unicode. Desetiško kodo pričnemo z znakom #, ki mu sledi zaporedje desetiških števk, šestnajstiško kodo pa z znakoma #x, sledi pa zaporedje šestnajstiških števk. Trdi presledek bi torej lahko napisali kot , kot   ali pa kot  .
Pri fizičnem oblikovanju besedila natančno določimo, kako želimo, da bo prikazan del besedila. Z uporabo elementa b (bold) bo besedilo izpisano krepko, z elementom i (italic) nagnjeno, če uporabimo element tt (teletype), bo besedilo izgledalo, kot bi bilo napisano na pisalni stroj. Z elementoma big in small lahko besedilo izpišemo večje ali manjše.
<p> To je <b>krepko</b> besedilo. </p> <p> To je <i>nagnjeno</i> besedilo. </p> <p> To je <tt>natipkano</tt> besedilo. </p> <p> To je <big>veliko</big> besedilo. </p> <p> To je <big><big>večje</big></big> besedilo. </p> <p> To je <big><big><big>še večje</big></big></big> besedilo. </p> <p> To je <small>majhno</small> besedilo. </p> <p> To je <small><small>manjše</small></small> besedilo. </p>
Pri logičnem oblikovanju določimo, kaj predstavlja posamezen del besedila, brskalnik pa se sam odloči, kako bo to prikazal. Pri tem mu lahko predlagamo, kako naj kaj oblikuje, a več o tem na drugem mestu (CSS). Med elemente za logično oblikovanje besedila spadajo sub (indeks), sup (potenca), em (poudarek), strong (močan poudarek), abbr (okrajšava), acronym (kratica), cite (sklic), code (koda), dfn (definicija), kbd (vnos), q (citat), samp (vzorec) in var (spremenljivka).
<p> H<sub>2</sub>O </p> <p> E = m c<sup>2</sup> </p> <p> To je <em>poudarek</em>. </p> <p> To je <strong>močan poudarek</strong>. </p> <p> To je <abbr>okrajšava</abbr>. </p> <p> To je <acronym>kratica</acronym>. </p> <p> To je <cite>sklic</cite>. </p> <p> To je <code>koda</code>. </p> <p> To je <dfn>definicija</dfn>. </p> <p> To je <kbd>vnos</kbd>. </p> <p> To je <q>citat</q>. </p> <p> To je <samp>vzorec</samp>. </p> <p> To je <var>spremenljivka</var>. </p>
Kot splošen oblikovni element pa omenimo še element span. Ta nima nobenih privzetih oblikovnih učinkov, uporabljamo pa ga v kombinaciji s stili CSS za oblikovanje besedila.
Uvod
