13 HTML stiilid
Stiiliatribuuti style kasutatakse HTML elementide stiliseerimiseks. Näiteks saame muuta elementide värvi, suurust, kirjatüüpi jm.
Stiiliatribuut lisatakse elemendi algusmärgendisse kujul:
<elemendinimi style="omadus:väärtus "> elemendi sisu </elemendinimi>
Kui soovime ühel elemendil kasutada mitut omadust korraga, siis saame soovitud omadused kirjutada üksteise järele kasutades eraldajana semikoolonit:
<elemendinimi style="omadus1:väärtus; omadus2:väärtus;"> elemendi sisu </elemendinimi>
Paljud veebiarendajad soovitavad semikoolonit kasutada ka juba ühe omaduse korral kuna nii on võimalik vältida tulevasi potentsiaalseid vigasid omaduste juurde lisamisel.
Taustavärv (background-color)
Elemendi taustavärvi saame muuta omadusega background-color. Muudame näiteks kogu kehaelemendi tausta siniseks:
<body style="background-color:blue;"> <h1>Pealkiri</h1> <p>See on tekstilõik.</p> </body>
Teksti värv (color)
Teksti värvi muutmiseks saame kasutada omadus color.
<h1 style="color:blue;">See pealkiri on sinine</h1> <p style="color:red;">See tekstilõik on punane.</p>
See pealkiri on sinine
See tekstilõik on punane.
Kirjatüüp (font-family)
Selleks, et määrata, millist kirjatüüpi kasutades on tekst kasutajale kuvatud, saame kasutada omadust font-family.
<h1 style="font-family:verdana;">See on pealkiri</h1> <p style="font-family:courier;">See on tekstilõik.</p>
Teksti suurus (font-size)
Teksti suuruse muutmiseks saame kasutada omadust font-size.
<h1 style="font-size:300%;">See pealkiri on tavatekstist 3 korda suurem</h1> <p style="font-size:2em;">See tekstilõik on 2 korda suurem kui tavatekst.</p>
Teksti joondamine (text-align)
Teksti joondamiseks vasakule, paremale või keskele saame kasutada text-align omadust. Väärtused, mida antud omadusele saame omistada on center (keskjoondus), left (vasakjoondus), right (paremjoondus) ja justify (rööpjoondus).
<h1 style="text-align:center;">Pealkiri</h1> <p style="text-align:left;">Tekstilõik vasakul.</p> <p style="text-align:right;">Tekstilõik paremal.</p> <p style="text-align:justify;">See on pikem tekstilõik, mille joonduseks on valitud rööpjoondus. See tähendab, et tekst on joondatud nii vasakult kui ka paremalt poolt.</p>
