Spoznali bomo
- Kako s CSS izvedemo barvni prehod med dvema ali več barvami
- Linearni barvni prehod med dvema ali več barvami
- Radialni barvni prehod med dvema ali več barvami
Izdelaj spletno stran, ki jo prikazujeta spodnja slika in video. Poimenuj jo 25vaja-css-priimek-ime.html. Stran naj bo izdelana v HTML5 in s CSS. Pazi na pravilno uporabo oznak in obliko zapisa kode.
CSS kodo vstavi v glavo spletne strani v oznako style.
Za predlogo vzemi vajo 24: Transformacije iz poglavja CSS.
Oblikovne lastnosti
- glavni naslov
h1:
- senčenje:
- linearni barvni prehod: od barve rgba(255,174,0,0.10) do rgba(255,174,0,1.00) in nazaj
- zunanji okvir:
- velikost: minimalna višina 750 pik
- obroba
- robovi
- senca
- radialni barvni prehod v ozadju od barve rgba(255,174,0,0.10) do barve rgba(255,174,0,0.60)
- povezave na slikah
a:
- transformacija: zmanjšanje slik na velikost 0,8, odstranitev rotacije slik, ki je bila izvedena v vaji 26
- povezave na slikah, ko je nad njo kurzor
a:hover:
- transformacija: povečava slike na velikost 1,1
- čas transformacije: 1 sekunda
- linearni barvni prehod v ozadju: pod kotom -45 stopinj od barve #FC8D01 do barve #F5DBBD
- obroba
Opomba: S pomočjo spodnje slike in videa manjkajoče oblikovne lastnosti določite sami!
