Uhlolojikelele lwezingcingo ze-Cascading Style namaSpredishithi wesitayela
Uma ukwakha iwebhusayithi kusukela ekuqaleni, kuwukuhlakanipha ukuqala ngezitayela eziyisisekelo ezichazwe. Kufana nokuqala ngendwangu ehlanzekile namabhulashi amasha. Enye yezinkinga zokuqala abakwa-web designers abhekana nazo ukuthi iziphequluli zewebhu zihlukile. Usayizi osayizi wefonti uhlukile kusuka kwipulatifomu kuya kwipulatifomu, umndeni wefonti ozenzakalelayo uhlukile, ezinye iziphequluli zichaza amachashazi kanye nokunamathisela emathekheni omzimba ngenkathi abanye bengenjalo, njalonjalo. Hamba uzungeze lokhu kungahambisani ngokuchaza izitayela ezizenzakalelayo zamakhasi akho wewebhu.
I-CSS kanye ne-Character Set
Izinto zokuqala kuqala, setha isethi yezinhlamvu zamadokhumenti akho e-CSS ku- utf-8 . Yize kungenzeka ukuthi amaphepha amaningi owakhayo abhalwe ngesiNgisi, amanye angase ahlelwe endaweni-aguqulelwe ngokwezilimi ezahlukene namasiko. Uma kunjalo, i-utf-8 yenza lula inqubo. Ukusetha uhlamvu lwesitayela kwishidi lesitayela yangaphandle ngeke kuthathe kuqala kunhlokweni ye-HTTP , kodwa kuzo zonke ezinye izimo, kuzokwenza.
Kulula ukusetha isethi sezinhlamvu. Ngokuba umugqa wokuqala weDokhumenti ye-CSS bhala:
@charset "utf-8";Ngale ndlela, uma usebenzisa abalingiswa bamazwe ngamazwe kumhlaba wokuqukethwe noma njengamagama weklasi namagama we-ID, ishidi lesitayela lizosebenza kahle.
Ukuthayipha umzimba wekhasi
Into elandelayo ishidi lesitayela esizenzakalelayo sidinga izitayela ukuze zivele emaphethini, emasimini, nasemingceleni. Lokhu kuqinisekisa ukuthi zonke iziphequluli zibeka okuqukethwe endaweni efanayo, futhi azikho izikhala ezifihliwe phakathi kwesiphequluli nokuqukethwe. Kumakhasi amaningi ewebhu, lokhu kuseduze kakhulu nombhalo, kodwa kubalulekile ukuqala lapho ukuze imifanekiso yasemuva nokuhlukaniswa komumo kuhlanganiswe kahle.
i-html, umzimba {margin: 0px; i-padding: 0px; umngcele: 0px; }}Setha umbala wangaphambili noma umbala wefonti kumnyama nombala ongemuva wokungena kumhlophe. Ngenkathi lokhu kuzoshintsha kakhulu ezinkampanini eziningi zekhasi lewebhu, ukuba nale mibala ejwayelekile efakwe emzimbeni nasethempelini le-HTML ekuqaleni yenza ikhasi lula ukufunda nokusebenza.
i-html, umzimba {umbala: # 000; isizinda: #fff; }}Izitayela Zefonti ezizenzakalelayo
Ubukhulu befonti nomndeni wefonti yizinto ezizoshintsha ngokuzenzakalelayo uma umklamo uthatha kodwa qalisa usayizi wefonti ozenzakalelayo we-1 em kanye nomndeni wefonti ozenzakalelayo we-Arial, i-Geneva, noma enye inhlobo ye-sans-serif. Ukusetshenziswa kwe-ems kugcina ikhasi lifinyeleleka ngangokunokwenzeka, futhi ifonti-sans-serif ingabonakala kakhulu esikrinini.
i-html, umzimba, p, th, td, li, dd, dt {ifonti: 1 ku-Arial, Helvetica, sans-serif; }}Kungenzeka kube nezinye izindawo lapho ungathola khona umbhalo, kodwa p , th , td , li , dd , ne- dt kuyisiqalo esihle sokuchaza ifoni eyisisekelo. Faka i- HTML nomzimba nje uma kwenzeka, kodwa iziphequluli eziningi zidlula ukhetho lwefonti uma uchaza kuphela amafonti akho we-HTML noma umzimba.
Izihloko
Izihloko ze-HTML zibalulekile ukusebenzisa ukusiza isiteleka sakho sewebhusayithi futhi uvumele izinjini zokusesha zijule kakhulu kwisayithi lakho. Ngaphandle kwezitayela, konke kuyizinto ezimbi kabi, ngakhoke zihleliwe ngokuzenzakalelayo kuzo zonke futhi zichaza umndeni wefonti namasayizi wefonti ngayinye.
h1, h2, h3, h4, h5, h6 {font-umndeni: Arial, Helvetica, sans-serif; } h1 {usayizi wefonti: 2em; } h2 {usayizi wefonti: 1.5em; } h3 {usayizi wefonti: 1.2em; } h4 {usayizi wefonti: 1.0em; } h5 {usayizi wefonti: 0.9m; } h6 {usayizi wefonti: 0.8m; }}Ungakhohlwa izixhumanisi
Ukumisa imibala yokuxhumanisa cishe kuyingxenye ebalulekile yokuklama, kepha uma ungawachazi izitayela ezizenzakalelayo, kungenzeka ukuthi uzokhohlwa okungenani amaqembu angamanga. Chaza ngokushintshashintsha okuncane okwesibhakabhaka bese ubashintsha uma unayo iphalethi yombala wesayithi echazwe.
Ukusetha izixhumanisi kumathunzi okwesibhakabhaka, setha:
- izixhumanisi njenge-blue
- uvakashele izixhumanisi njenge-blue blue
- izixhumanisi ze-hover njenge-blue blue
- izixhumanisi ezisebenzayo njengalokhu luhlaza okwesibhakabhaka
njengoba kuboniswe kulesi sibonelo:
i: isixhumanisi {umbala: # 00f; } a: bahambele {umbala: # 009; } a: i-hover {umbala: # 06f; } a: okusebenzayo {umbala: # 0cf; } Ngokuzifaka izixhumanisi nge-scheme engenambala engumbala, kuqinisekisa ukuthi ngeke ngikhohlwe noma yiziphi izinkampanini, futhi ngizikhulume kancane kancane kunombala ohlaza okwesibhakabhaka, obomvu nokubomvu.Ishidi eligcwele lesitayela
Nasi ishidi eligcwele lesitayela:
@charset "utf-8"; i-html, umzimba {margin: 0px; i-padding: 0px; umngcele: 0px; umbala: # 000; isizinda: #fff; } html, umzimba, p, th, td, li, dd, dt {ifoni: 1 ku-Arial, Helvetica, sans-serif; } h1, h2, h3, h4, h5, h6 {ifonti-umndeni: Arial, Helvetica, sans-serif; } h1 {usayizi wefonti: 2em; } h2 {usayizi wefonti: 1.5em; } h3 {usayizi wefonti: 1.2em; } h4 {usayizi wefonti: 1.0em; } h5 {usayizi wefonti: 0.9m; } h6 {usayizi wefonti: 0.8m; } a: isixhumanisi {umbala: # 00f; } a: bahambele {umbala: # 009; } a: i-hover {umbala: # 06f; } a: okusebenzayo {umbala: # 0cf; }}