abc HTML5 i CSS TUTORIAL - Linijski CSS /INLINE CSS/

Boja pozadine paragrafa /PARAGRAPH/ <p>


Slika 1. Boja pozadine /BACKGROUND COLOR/ STYLE="background-color

Boja pozadine paragrafa /PARAGRAPH/  Sintaksa:   <p style="background-color:naziv_boje | kod_boje;">

Oznake:
p paragraf /PARAGRAPH/

background-color - Atribut za boju pozadine
naziv_boje - engleski naziv boje - Popis kodova i naziva boja je u dodatku.
kod_boje - Vrijednosti boja su od 0 - 255 (>>) odnosno heksadimalno sa znakom # ispred broja (00 do FF)Heksadicimalni brojevi :
Red – crvena – 00 - 255 - #FF0000
Green – zelena – 00 - 255 - #00FF00
Blue – plava – 00 – 255 - #0000FF


Slika 2. Boja pozadine paragrafa /PARAGRAPH/

Parametri boje pozadine paragrafa /PARAGRAPH/.

Aktivnost

Primjer koda

Primjer ispis

Crvena pozadina paragrafa, ime boje RED.

 <p style="background-color:red;">Ovo je crveno</p>

Ovo je crveno

Žuta pozadina paragrafa, ime boje YELLOW.

 <p style="background-color:yellow;">Ispis na žutoj podlozi</p>

Ispis na žutoj podlozi

Crvena pozadina paragrafa, kod boje #FF0000.

<p style="background-color:#FF0000;">Kod boje za pozadinu paragrafa</p>

Kod boje za pozadinu paragrafa

Siva pozadina paragrafa, kod boje #C0C0C0.

<p style="background-color:#C0C0C0;">Siva pozadina </p>

Siva pozadina

Žuta pozadina paragrafa, kod boje #FFFF00.

<p style="background-color:#FFFF00">Kod za žutu boju </p>

Kod za žutu boju

Daljnji rad: 

  1. Ispis teksta na plavoj podlozi (naziv boje)
  2. Ispis teksta na sivoj podlozi (naziv boje)
  3. Ispis teksta na zelenoj podlozi (naziv boje)
  4. Ispis teksta na plavoj podlozi (kod boje)
  5. Ispis teksta na sivoj podlozi (kod boje)
  6. Ispis teksta na zelenoj podlozi (kod boje)
  7. Ispis teksta na ljubičastoj podlozi (kod boje)
  8. Ispisati dvije poslovice sa različitim bojama
  9. Ispista imena 6 naučnika sa različitim boja pozadine paragrafa.
  10. Kod boje unijeti proizvoljnu vrijednost.

Prozor na dnu stranice je namjenje za provjeru koda:
- kopirajte kod (edit, copy, paste ili CTRL+C, CTRL+V ili DRAG&DROP metodom), editovanje je moguće u prozoru

Index