Spoznali bomo
- Kako s CSS prikažemo element
- Kako s CSS skrijemo element
Izdelaj spletne strani, ki jih prikazujejo spodnje slike in jih poimenuj:
14vaja-css-priimek-ime.html
14vaja1-css-priimek-ime.html
14vaja2-css-priimek-ime.html
Strani naj bodo izdelane v HTML5 in s CSS. Pazi na pravilno uporabo oznak in obliko zapisa kode.
Za predlogo uporabi 16. vajo iz poglavja HTML: 16: Opisni seznam.
CSS kodo vstavi v glavo spletnih strani v oznako style
.
Besedilo Skrij opise knjig... na 1. strani je povezava, ki kaže na 2. stran. Besedilo Skrij opise knjig... na 2. strani je povezava, ki kaže na 3. stran, besedilo Prikaži opise knjig... na 3. strani pa je povezava, ki kaže na 1. stran.
1. stran - 14vaja...
Oblikovne lastnosti 1. strani
- stran -
body
:
- pisava: "Trebuchet MS", Verdana, sans-serif
- velikost pisave: 85 odstotkov
- ozadje: slika ozadje.jpg
- okvir vsebine
section
:
- barva ozadja: bela
- velikost: 80 odstotkov
- obroba: debeline črte 1 piko, polna črta, barv: siva
- poravnava: sredinsko
- notranji odmik: 20 pik
- ozadje: slika ozadje1.jpg, poravnana zgoraj desno, prikazana samo enkrat
- zaobljeni robovi: 10 pik
- glavni naslov
h1
:
- barva pisave: rgba(42,139,255,1.00)
- velikost pisave: 180 odstotkov
- podnaslov
h2
:
- barva pisave: rgba(205,91,3,1.00)
- velikost pisave: 150 odstotkov
- naslovi ospinega seznama
dt
:
- barva pisave: rgba(248,147,2,1.00)
- oblika pisave: krepko
- opisi ospinega seznama
dd
:
- barva pisave: siva
- hiperpovezave
a
:
- oblika besedila: brez podčrtave
- barva pisave: rgba(42,139,255,0.60)
- velikost pisave: 80 odstotkov
- hiperpovezave, ko smo z miško nad njo
a:hover
:
- barva piave: rgba(42,139,255,1.00)
- prvi odstavek besedila:
- velikost pisave: 100 odstotkov
- oblika pisave: krepko

2. stran - 14vaja1...
Oblikovne lastnosti 2. strani
- ... kopija 1. strani
- opisi ospinega seznama
dd
:
- prikaz: visibility: hidden

3. stran - 14vaja2...
Oblikovne lastnosti 3. strani
- ... kopija 1. strani
- opisi ospinega seznama
dd
:
- prikaz: display: none
