Funda ukuthi ungakha kanjani umngcele wethebula le-CSS ngemizuzu emihlanu nje
Kungenzeka ukuthi uzwile ukuthi amatafula e-CSS ne-HTML awahlanganisi. Lokhu akulona iqiniso. Yebo, ukusebenzisa amatafula e- HTML wesakhiwo akusekho umklamo we-web best, oshintshiwe yizindlela zokuhlela ze-CSS, kodwa amathebula aseyindlela efanele yokusebenzisa idatha yokwengeza ekhasini lewebhu.
Ngeshwa, ngoba ochwepheshe abaningi bewebhu baye basuka ematafuleni becabanga ukuthi bangobuthi, abaningi balabo abaqeqeshiwe abanolwazi oluncane lokusebenza nalesi sici se-HTML evamile kanye nomzabalazo uma kufanele babathinte ekhasini lewebhu. Isibonelo, uma unetafula ekhasini futhi ufuna ukwengeza imigqa yangaphakathi kumaseli etafula.
I-CSS Table Borders
Uma usebenzisa i- CSS ukwengeza imingcele ematafuleni, ingeza kuphela umngcele ojikeleze ngaphandle kwetafula. Uma ufuna ukungeza imigqa yangaphakathi kumaseli ngabanye alawo tafula, udinga ukungeza imingcele ezikhathini zangaphakathi ze-CSS. Ungasebenzisa futhi ithegi yakwa-HR ukwengeza imigqa ngaphakathi kwamaseli ngabanye.
Ukuze usebenzise izitayela ezikulesi sihloko, kufanele ube netafula ekhasini lakho lewebhu. Kumele udale ishidi lesitayela njengeshidi lesitayela sangaphakathi enhloko yedokhumenti yakho (cishe uzokwenza lokhu uma "isayithi" lakho lilodwa ikhasi) noma unamathiselwe kudokhumenti njengeshidi lesitayela sangaphandle (yilokho wena uzokwenzenjani uma isayithi lakho lingamakhasi amaningi - okukuvumela ukuba usitayele wonke amakhasi kusuka kweshidi elilodwa langaphandle). Uzobeka izitayela ukwengeza imigqa yangaphakathi kuleso shidi sesitayela.
Ngaphambi Kokuqala
Okokuqala udinga ukunquma ukuthi ufuna ukuthi imigqa ibonakale etafuleni lakho. Unezinketho eziningana, kufaka phakathi:
- Uzungeze wonke amaseli ukwakha igridi;
- Ukubeka imigqa phakathi kwamakholomu;
- Kuphakathi kwemigqa; noma
- Phakathi kwamakholomu athile noma imigqa.
Ungakwazi futhi ukubeka imigqa ezungeze amaseli ngayinye noma ngaphakathi kwamangqamuzana ngabanye.
Indlela Yokufaka Amakhodi Emhlabeni Wonke Amaseli Ethebula
Ukwengeza imigqa ezungeze wonke amaseli asetafuleni lakho, ukudala leyo mphumela-njengegridi, engeza okulandelayo kwishidi lakho lesitayela:
td, th {
Umngcele: omnyama o-1px omnyama;
}}
Indlela Yokufaka Imigqa Phakathi Kwaphela Amakholomu Etafuleni
Ukwengeza imigqa phakathi kwamakholomu (lokhu kudala imigqa emibala egijima ukusuka phezulu kuya phansi emakholomu etafuleni), engeza okulandelayo kwishidi lakho lesitayela:
td, th {
Umngcele-kwesobunxele: obumnyama obungu-1px;
}}
Khona-ke, uma ungafuni ukuthi bavele kukholomu yokuqala, kuzodingeka wengeze ekilasini kulawo ma- th kanye nama- td amaseli. Kulesi sibonelo, sicabanga ukuthi sineklasi elingenamngcele kulawo maseli futhi susa umngcele ngalolu mthetho oqondile we-CSS. Ngakho nasi isigaba se-HTML esingazisebenzisa:
isigaba = "akukho umngcele">
Futhi-ke singafaka isitayela esilandelayo kwishidi lethu lesitayela:
.ngasemngceleni {
umngcele-kwesobunxele: akekho;
}}
Indlela Yokufaka Imigqa Phakathi Kwaphela Imindeni Etafuleni
Njengokungeza imigqa phakathi kwamakholomu, ungenza lokhu ngesitayela esisodwa esilula esengeziwe kwishidi lakho lesitayela. I-CSS engezansi ingeza imigqa eqondile phakathi komugqa ngamunye wetafula lethu:
tr {
umngcele-ngezansi: omnyama o-1px omnyama;
}}
Futhi ukususa umngcele ukusuka phansi kwetafula, uzophinde uphinde ufake isigaba kulowo mbuzo:
isigaba = "akukho umngcele">
Engeza isitayela esilandelayo kwishidi lakho lesitayela:
.ngasemngceleni {
umngcele-phansi: akekho;
}}
Indlela Yokufaka Imigqa Phakathi Kwezingqimba Eziqondile noma Imigqa Ethebula
Uma ufuna kuphela imigqa phakathi kwemigqa ethile noma amakholomu, udinga ukusebenzisa isigaba kulawo maseli noma imigqa. Ukwengeza umugqa phakathi kwamakholomu kunzima kakhudlwana kunokuphakathi kwemigqa ngoba kufanele wengeze iklasi kuwo wonke amaseli kuleyo kholomu. Uma ithebula lakho likhiqizwa ngokuzenzakalelayo kusuka ku -CMS lenye uhlobo , lokhu kungenzeka ukuthi akunakwenzeka, kodwa uma usukhawule ngesandla, ungangezela amakilasi afanelekayo njengoba kudingeka ukuze ufeze lokhu.
isigaba = "eceleni komngcele">
Ukwengeza imigqa emkhatsini wemigqa kulula, njengoba ungakwazi nje ukufaka ekilasini emgqeni ofuna umugqa.
isigaba = "umngcele-phansi">
Bese ufaka i-CSS kwishidi lakho lesitayela:
.border-side {
Umngcele-kwesobunxele: obumnyama obungu-1px;
}}
phansi {
umngcele-ngezansi: omnyama o-1px omnyama;
}}
Indlela Yokufaka Amakhodi Ezingqamuzana Ngamanye Amakholi Ethebula
Ukwengeza imigqa ezungeze amaseli ngayinye, ufaka iklasi kumaseli ofuna umngcele ozungezile:
isigaba = "umngcele">
Bese ufaka i-CSS elandelayo kwishidi lakho lesitayela:
.ngemuva {
Umngcele: omnyama o-1px omnyama;
}}
Indlela Yokufaka Amayini Ngaphakathi Amaseli Akhe Etafuleni
Uma ufuna ukwengeza imigqa ngaphakathi kokuqukethwe kweseli, indlela elula yokwenza lokhu ingomaki wokubusa oqondile (
).
Amathiphu awusizo
Uma ubona izikhala emingceleni yakho, kufanele uqiniseke ukuthi isitayela sokungena emngceleni usethe etafuleni lakho. Engeza okulandelayo kwishidi lakho lesitayela:
ithebula {
umngcele-ukuwa: ukuwa;
}}
Ungagwema yonke i-CSS engenhla futhi usebenzise imfanelo yomngcele kuthegi lakho lethebula. Kodwa-ke, qaphela ukuthi imfanelo yakhe, ngenkathi ingavunyelwe, isuke iguquguquke kakhulu kuneCSS, njengoba ungakwazi kuphela ukuchaza ububanzi bomngcele futhi ingaba nayo kuphela kuwo wonke amaseli etafuleni noma ayikho.