Layout Babu Rubutun Buɗe Ƙananan Firayim Ne
Akwai dalilai da dama don kada ku yi amfani da launi don layout . Ɗaya daga cikin dalilai mafi yawan mutane da suke ba don ci gaba da amfani da su shi ne saboda yana da wuya a yi layi tare da CSS. Ko da yake rubutun CSS yana ƙunshe da ƙoƙarin koyo, lokacin da ka fahimci yadda za a yi CSS layout, zaka iya mamakin yadda sauƙi zai kasance. Kuma da zarar ka koyi, za ka yi magana game da dalili na biyu na dalili da mutane ke ba don ba da amfani da CSS- "Yana da sauri don rubuta Tables." Yana da sauri domin ka san Tables, amma idan ka koyi CSS, zaka iya zama kamar sauri tare da wannan.
Binciken Bincike na CSS Matsayi
Matsayin CSS yana da tallafawa sosai a duk masu bincike na zamani . Sai dai idan kuna gina wani shafin don Netscape 4 ko Internet Explorer 4, masu karatu ba su da matsala ga duba shafin yanar gizonku na CSS.
Rethinking Yadda Za Ka Gina wani Page
Idan ka gina wani shafin ta yin amfani da Tables, dole kayi tunani a cikin tsarin rubutu. A wasu kalmomi, kuna tunani game da kwayoyin halitta da layuka da ginshiƙai. Shafukan yanar gizonku zasu nuna wannan tsarin. Lokacin da kake motsawa zuwa tsarin zane na CSS, za ka fara tunanin abubuwan shafukanka dangane da abubuwan da ke ciki, domin ana iya sanya abun ciki a duk inda kake so a cikin layout-ko da yake a kan wani abun ciki.
Shafukan yanar gizo daban-daban suna da nau'o'in daban. Don gina tasiri mai tasiri, kimanta tsarin tsarin kowane shafi kafin ka sanya abun ciki zuwa gare ta. Misali na shafi na iya haɗa da sassan sassa guda biyar:
- Rubuta . Shafin gida ga banner talla, sunan shafin, hanyoyin haɗi, wani labarin da kuma wasu abubuwa.
- Hakan dama . Wannan ita ce gefen dama na shafin tare da akwatin bincike, tallace-tallace, kwalaye bidiyo, da wuraren yan kasuwa.
- Abun ciki . Rubutun wani labarin, shafi na blog ko kantin sayar da kaya - nama da dankali na shafin.
- Tallace-tallace na layi . Tallan tallace-tallace a cikin abun ciki.
- Hanya . Ƙarin ƙasa, bayanin marubucin, bayanin haƙƙin mallaka, ƙananan tallace-tallacen banner, da kuma alaƙa da alaka.
Maimakon saka waɗannan abubuwa biyar a cikin tebur, yi amfani da abubuwa masu rarraba na HTML5 don ƙayyade sassa daban-daban na abun ciki, sannan kuma amfani da matsayi na CSS don sanya abubuwan abubuwan ciki a shafin.
Ƙididdige Sassan Gidanku
Bayan da ka riga aka bayyana wurare daban-daban na shafin ka, kana bukatar ka rubuta su a cikin HTML. Duk da yake za ka iya, a kullum, sanya sassanka a kowane tsari, yana da kyau ra'ayin sanya matakan da suka fi muhimmanci a shafinku. Wannan tsarin zai taimakawa tare da bincike-bincike na injiniya, kazalika.
Don nuna matsayin wuri, duba shafi tare da ginshiƙai guda uku amma ba maɓalli ko ƙafa. Zaka iya amfani da matsayi don ƙirƙirar kowane irin layout da kake so.
Domin jerin shimfida uku, ƙayyade sashe uku: hagu na hagu, ginshiƙin dama, da abun ciki.
Wadannan sashe zasuyi ta hanzari ta yin amfani da takaddun shaida don abun ciki da biyu Sashe abubuwa don ginshiƙai guda biyu. Duk abin kuma zai kasance da alamar ganowa. Lokacin da kake amfani da alamar id, dole ne ka ƙirƙiri wani suna na musamman ga kowane id.
Matsayi abun ciki
Ta amfani da CSS, ƙayyade matsayi don abubuwan ID'd naka. Ajiye bayanan wuri naka a cikin wani salon salon kamar wannan:
#content {
}
Abubuwan ciki a cikin waɗannan abubuwa zasu dauki nauyin sarari kamar yadda zai iya, wato kashi 100 cikin dari na fadin wuri na yanzu ko shafi. Don rinjayar wurin da wani sashi ba tare da tilasta shi zuwa nesa ba, canja canji ko halayen gefe.
Don wannan shimfidawa, saita ginshiƙai guda biyu zuwa ƙa'idodi masu tsabta sannan kuma saita matsayi na cikakke, don kada su sami tasiri ta wurin inda aka samo su cikin HTML.
# hagu-hagu {
matsayi: cikakke;
hagu: 0;
nisa: 150px;
gefe-hagu: 10px;
gefe-saman: 20px;
launi: # 000000;
Dama: 3px;
}
# hagu-dama {
matsayi: cikakke;
Hagu: 80%;
saman: 20px;
nisa: 140px;
padding-hagu: 10px;
z-index: 3;
launi: # 000000;
Dama: 3px;
}
Sa'an nan kuma don yanayin abun ciki, saita alamar dama a hannun dama da hagu domin abun ciki ba zai keta ginshiƙan biyu ba.
#content {
sama: 0px;
gefe: 0px 25% 0 165px;
Dama: 3px;
launi: # 000000;
}
Ƙayyade shafinka ta amfani da CSS a maimakon wani tebur na HTML yana buƙatar ƙwarewar fasaha, amma farashin ya fito ne daga mafi sauƙi da kuma dacewa da kayayyaki da kuma mafi sauƙi a yin gyare-gyaren tsarin zuwa shafinka daga baya.