Spoznali bomo
- Kako s CSS določimo velikost elementov
- Kako s CSS določimo minimalno in maksimalno velikost elementov
- Kako zaobljimo robove elementov
Izdelaj spletno stran, ki jo prikazuje spodnja slika in jo poimenuj 13vaja-css-priimek-ime.html
. Stran naj bo izdelana v HTML5 in s CSS. Pazi na pravilno uporabo oznak in obliko zapisa kode.
Za predlogo uporabi 14.vajo iz poglavja HTML: 14: Logična oblika.
CSS kodo vstavi v glavo spletne strani v oznako style
.
Oblikovne lastnosti
- stran -
body
:
- pisava: "Open Sans", sans-serif
- oblika pisave: pri pisavi Open Sans uporabi znake Latin in Greek
- okvir vsebine
section
:
- velikost: širina 90 odstotkov
- poravnava: sredinsko
- notranji odmik: 10 pik
- obroba: debelin črte 1 piko, polna črta, barve #ccc
- barva ozadja: #f4f4f4
- glavni naslov:
- barva besedila: rdeča
- velikost pisave: 2 kratnik višine vrstice
- znak π v naslovu:
- notrnji odmik: levo in desno 10 pik
- barva besedila: oranžnordeča
- oblika pisave: krepko
- velikost pisave: 2 kratnik višine vrstice
- znak π v besedilu
mark
:
- notrnji odmik: levo in desno 5 pik
- barva besedila: #ff3e41
- barva ozadja: #d0d0d0
- velikost pisave: 1,2 kratnik višine vrstice
- drugi odstavek (Opombe: ...):
- barva besedila: #0090f9
- velikost pisave: 0,8 kratnik višine vrstice
- okvir slike:
- velikost: širina 300 pik
- obroba: debelina črte 1 piko, polna črta, barva #999
- zaobljeni robovi: 10 pik
- poravnava: sredinsko
- odstavek
blockquote
:
- barva ozadja: #f7cf8f
- zaobljeni robovi: 10 pik
- zunanji odmiki: samodejno
- notranji odmiki: zgoraj in spodaj 5 pik, levo in desno 20 pik
- velikost: minimalna širina 400 pik, maksimalna širina 800 pik
- velikost pisave: 0,8 kratnik višine vrstice
- poravnava: sredinsko
- številčni zapis vrednosti π
samp
:
- barva ozadja: #ccc
- zaobljeni robovi: 5 pik
- notranji odmiki: 3 pike
- velikost: minimalna širina 400 pik, maksimalna širina 650 pik
- enačbe med besedilom
code
:
- barva besedila: siva
- velikost pisave: 1,2 kratnik višine vrstice
- poravnava: sredinsko
- notranji odmiki: levo in desno 3 pike
- spodnja enačba
code
:
- širina okvirja: 200 pik
- barva ozadja: #f7cf8f
- barva pisave: srebrna
- obroba: debelina črte 2 piki, pikčasta črta, barva #f9a834
- zaobljeni robovi: 5 pik
- velikost pisave: 2,5 kratnik višine vrstice
- levi notranji odmik: 25 pik