Sunday, 16 March 2014

Teine kodutöö

Teiseks kodutööks oli eelmise kodutööna koostatud veebilehe kujundamine: 

  • erifontide kasutamine, 
  • korduv taustapilt, 
  • pseudoklasside kasutamine, 
  • jm mis sai tunnis läbi proovitud. 
Töö koostamisel kasutasin lisaks eelmisel tunnil õpitule ka õppejõu konspekti

Mida tegin? 

1. Tegin eraldi .css faili ja linkisin selle .html failiga.
2. Lisasin korduva taustapildi. 
3. Muutsin pealkirjade fonte, selleks leidisin veebist sobilikke. Erifontide kasutamisel tasuks arvestada, et tähed õ, ä, ö ,ü võivad jääda muutmata või neid mõne fondi puhul üldse ei kuvata. 
4. Muutsin pealkirjade ja põhitekstide värvusi taustapildiga sobivaks, fontide suurusi (pealkirjad suuremaks) ning pealkirjade paiknemist (keskel, vasakul, paremal). 
5. Lisasin sektsioonidele valge tausta (läbipaistvust ei kasutanud), serva äärised (muutsin ka joonte värvust), esimese ja viimase sektsiooni nurkade raadiusi.
6. Paigutasin sektsioonid lehe keskele, määrasin sobiliku laiuse ja "polsterduse".
7. Kolmandas sektsioonis kasutasin tausta astmetäidet, mis tekitas tausta värvuse sujuva ülemineku valgest roosani.  
8. Lisaisn nurkadesse ja viimase sektsiooni alaserva keskmisesse ossa eripilte. 
9. Teise, kolmanda ja neljanda sektsiooni pealkirjadele lisasin efekti (hiirega teksti peale liikudes muudab viimane värvi). 
10. Muutsin esimese sektsiooni põhiteksti esimese tähe fonti, selle värvust ja suurust. 
11. Lisasin teises sektsioonis olevatele piltidele efekti (hiirega pildile liikudes liigub pilt esile ja pöörab). 
12. Tabelis muutsin päise tausta ning lisasin efekti (hiirega tabelile liikudes muutub selle taust värvi). 
13. Lingi efekti kasutamiseks lisasin esmalt oma veebilehele ühe lingi. Eriefekti käigus hiirega lingile liikudes muutub selle tekst valgeks ja taust tumelillaks.  

Tulemus siin

Töö tegemisel soovisin kasutada konspektis kirjeldatud pseudoklassi tabelis tühjade lahtrite taustavärvi muutmiseks. Konspektis lk 10 on selleks pseudoklassi soovitus: 

td:empty
{
background-color:grey;
}

See pseudoklass peaks muutma tabeli tühjad lahtrid halliks. Minul see millegipärast ei töötanud.