Dzidza kuti ungagadzira sei mureza weCSS mumaminitsi mashanu chete
Iwe unogona kunge wakanzwa kuti CSS neHTML tables hazvibatanidzi. Izvi hazvisi chokwadi. Hongu, kushandiswa kwemastafura eIndaneti haisi iyo web design yakanakisisa miitiro, iyo yakatsiviwa neCSS mitambo yekugadzirisa, asi matafura achiri chikonzero chakakodzera chekushandisa kuwedzera dhesi yepa webpage.
Zvinosuruvarisa, nokuti vazhinji vevashandi vewebhu vakashandura kubva pamatafura vachifunga kuti vane uchetura, vazhinji vevashandi vacho vane ruzivo rwakawanda rwekushanda pamwe chete nehana yeHTML yezvinhu uye kurwisana pavanofanira kuitora pa webpage. Semuenzaniso, kana iwe uine tafura pane peji uye unoda kuwedzera mitsara mukati mematafura ematafura.
CSS Dhawende Rwenharaunda
Paunoshandisa CSS kuwedzera miganhu kumatafura, inongowedzera muganhu uri kunze kwetafura. Kana iwe uchida kuwedzera mitsetse yepakati kumasero ega etafura iyo, unofanira kuwedzera miganhu kumativi eCSS elements. Iwe unogonawo kushandisa trick HR kuti uwedzere miganhu mukati memasero ega.
Kuti ushandise maitiro akafukidzwa munyaya ino, unofanira kunge uine tafura pane peji rako rewebhu. Iwe unofanirwa kusika chidimbu chepepeti sechomukati chidimbu chepepeti mumusoro wepepa yako (iwe ungangoita izvi chete kana iwe "site" yako iri peji imwe chete) kana kuti yakabatanidzwa pane dhiyo sewekunze chepeti pepa (izvi ndizvo zvauri iwe achaita kana nzvimbo yako iri mapeji akawanda - achikubvumira kuti utaure mapeji ose kubva pane imwe peji pekunze). Iwe uchaisa mararamiro ekuwedzera mitsara mukati mukati mayo mavara.
Usati Watanga
Kutanga iwe unoda kusarudza kwaunoda kuti mitsetse ioneke patafura yako. Une maitiro akawanda, kusanganisira:
- Akakomberedza ose masero kuti aite gridhi;
- Kugadzirisa mitsetse pakati pehurukuro;
- Pakati pemigwagwa; kana
- Pakati pemamwe mapuranga kana mitsetse.
Iwe unogonawo kuisa mitsara yakapoteredza masero ega kana mukati memasero ega.
Nzira Yokuwedzera Mirapi Munharaunda Mese Matafura ari muTefa
Kuti uwedzere mitsara yakapoteredza masero ari mutafura yako, achigadzira grid-sechiitiko, wedzera zvinotevera kumutauro wepepa yako:
nkm, th {
muganhu: solid 1px black;
}
Nzira Yokuwedzera Migwagwa Pakati Pezvakangoita Mifananidzo MuTebhenekeri
Kuti uwedzere miganhu pakati pemakoroni (izvi zvinogadzira miganhu yakananga inotangira kubva kumusoro kusvika pasi pamatafura etafura), wedzera zvinotevera kumashizha ako:
nkm, th {
border-left: solid 1px black;
}
Zvadaro, kana iwe usingadi kuti vaonekwe pachikamu chekutanga, iwe uchada kuwedzera kirasi kune iyo th uye td masero. Mumuenzaniso uyu, tinofunga kuti tine kirasi yeusati-muganhu pane iyo masero uye tinobvisa muganhu pamwe chete nemutemo uyu weCSS chaiwo. Saka heinoi iyi yeklasi ye HTML yatingazoshandisa:
kirasi = "hapana-muganhu">
Uye zvino tinogona kuwedzera chimiro chinotevera kumutauro wepepeti yedu:
.no-border {
muganhu-kuruboshwe: hapana;
}
Nzira Yokuwedzera Migwagwa Pakati Pezvakangoita Mhuri muTereta
Sezvo nekuwedzera mitsetse pakati pehurukuro, iwe unogona kuita izvi nemutauro mumwe chete wakanyanyisa wakawedzerwa pane yako faira pepa. Izvo pasi peCSS zvingawedzera mitsetse yakatsetseka pakati pemutsara wega wetafura yedu:
tr {
border-bottom: solid 1px black;
}
Uye kubvisa muganhu kubva pasi petafura, iwe unogona zvakare kuwedzera kirasi kune iyo tr tag:
kirasi = "hapana-muganhu">
Wedzera chimiro chinotevera kumutauro wepepa yako:
.no-border {
Muganhu-pasi: hapana;
}
Nzira Yokuwedzera Mitsara Pakati Pezvakagadzirirwa Makomborero kana Row muTebhenekeri
Kana iwe chete uchitsvaga mitsara pakati pemitsetse yakasiyana kana mapuranga, unoda kushandisa kirasi pane iyo masero kana mitsara. Kuwedzera mutsetse pakati pevharuku kwakaoma zvakaoma kudarika pakati pemiganhu nekuti unofanira kuwedzera kirasi kune yese sevha muhomwe iyoyo. Kana tafura yako ichigadziriswa kubva kuCMS yerimwe rudzi , izvi zvingaita hazvibviri, asi kana iwe uri nechokuita coding peji, unogona kuwedzera makirasi akakodzera sezvaunoda kuti uite izvi.
kirasi = "kurutivi-mhiri">
Kuwedzera mitsetse pakati pemiganhu yakajeka zvikuru, sezvo iwe unogona kuwedzera kirasi kumutsara unoda mutsara.
chikoro = "muganhu-pasi">
Zvadaro wobva wawedzera CSS pane yako pepa sheet:
.border-side {
border-left: solid 1px black;
}
.border-bottom {
border-bottom: solid 1px black;
}
Nzira yekuwedzera Mines Evanhu Pamwe Chete muTereta
Kuti uwedzere miganhu yakapoteredza masero ega, unowedzera kirasi kumasero iwe unoda muganhu wakakomberedza:
kirasi = "muganhu">
Uye wobva wawedzera CSS inotevera kumashizha ako:
.border {
muganhu: solid 1px black;
}
Nzira yekuwedzera Minesheni Muchikati Chega Mamwe Maseke muTebhenekeri
Kana iwe uchida kuwedzera mitsetse mukati mezviri mukati memusero, nzira iri nyore yekuita izvi ndeyeti yakatsetseka tateti (
).
Mazano anobatsira
Kana ukacherechedza zvikanganiso mumiganhu yako, unofanirwa kuve nechokwadi chokuti muganhu-kuparara unoiswa pafura yako. Wedzera zvinotevera pane yako faira pepa:
tafura
border-collapse: collapse;
}
Iwe unogona kudzivisa zvose zveCSS iri pamusoro apa uye shandisa muganhu wemuganhu mutafura yako patafura. Cherechedza, zvisinei, kuti chimiro chake, kunyange chisina kuregererwa, hachina kunyatsogadziriswa kupfuura CSS, sezvo iwe unogona kungotsanangura upamhi hwemuganhu uye unogona kungova nechokupoteredza masero ose etafura kana kuti hapana.