Kena koma sederhana nyederhanake kode
CSS, utawa Cascading Style Sheets, iku cara sing ditampa industri desain web kanggo nambah gaya visual menyang situs. Kanthi CSS, sampeyan bisa ngontrol tata letak halaman, werna, typography , gambar latar, lan liya-liyane. Sejatine, yen gaya visual, banjur CSS minangka cara kanggo ngowahi gaya kasebut menyang situs web sampeyan.
Nalika sampeyan nambah gaya CSS menyang dokumen, sampeyan bisa sok dong mirsani yen dokumen wiwit njaluk maneh lan maneh. Malah situs cilik karo mung sawetara kaca bisa rampung karo file CSS sing cukup gedhe - lan situs sing gedhe banget karo akeh lan akeh kaca konten unik bisa duwe file CSS gedhe banget. Iki ditambahake karo situs sing responsif sing duwe akeh pitakon media sing disedhiyakake ing lembar gaya kanggo ngganti cara ndeleng visual lan kaca sing metu kanggo layar sing beda.
Ya, file CSS bisa dawa banget. Iki ora masalah utama nalika nerangake kinerja situs lan kecepatan download, amarga file CSS sing dawa banget cilik (amarga bener-bener mung document document). Isih, saben sithik banget nalika nerangake kacepetan kaca, dadi yen sampeyan bisa nggawe gaya lembaran, luwih apik. Iki ngendi "koma" bisa teka ing banget Handy ing sheet gaya Panjenengan!
Koma lan CSS
Sampeyan bisa uga kepingin weruh apa peran koma ing sintaks pemilih CSS . Kaya ing ukara, koma ndadekake kajelasan-ora kode-kanggo separator. Ing koma ing pemilih CSS misahaké sawetara pamilihan ing gaya sing padha.
Contone, ayo ningali sawetara CSS ing ngisor iki.
th {color: red; }
td {color: red; }
p.red {color: red; }
div # firstred {color: red; }
Kanthi sintaks iki, sampeyan ngandhani yen sampeyan pengin th tags, tags td, tag paragraf karo kelas abang, lan tag div karo ID firstred kabeh duwe gaya werna abang.
Iki becik ditampa CSS, nanging ana rong kekuwatan penting kanggo nulis cara iki:
- Ing mangsa ngarep, yen sampeyan arep ngowahi werna font sifat kasebut dadi biru, sampeyan kudu nggawe owah-owahan sing kaping papat ing style sheet.
- Iku nambah akeh karakter ekstra menyang sheet gaya sing sampeyan ora perlu. 4 gaya iki ora koyone kaya overkill, nanging yen sampeyan terus nindakake iki kabeh lembar gaya, garis bakal nambah lan sheet sing bakal akeh, luwih gedhe tinimbang sing perlu.
Supaya bisa ngatasi kelemahan kasebut, lan kanggo ngatasi file CSS sampeyan, kita bakal nyoba nggunakake koma.
Nggunakake koma kanggo milih pemisah
Tinimbang nulis 4 seleksi CSS sing kapisah lan 4 aturan, sampeyan bisa gabungke kabeh gaya kasebut dadi siji aturan properti kanthi misahake seleksi individu kanthi koma. Punika caranipun:
th, td, p.red, div # firstred {color: red; }
Karakter koma tegese minangka tembung "lan" nang pemilih. Dadi iki ditrapake kanggo t h tags lan tag td lan tag paragraf karo kelas abang lan tag div karo ID firstred. Punika ingkang sampun kita lampahi, nanging mbetahaken 4 aturan CSS, kita gadhah aturan tunggal kaliyan kathah seleksi. Iki minangka koma ing pemilih, ngidini kita duwe sawetara pemilih ing siji aturan.
Ora mung pendekatan iki nggawe luwih alus, file CSS resik, uga nganyari mangsa luwih gampang. Saiki yen sampeyan pengin ngganti werna saka abang dadi biru, sampeyan mung kudu nggawe owah-owahan ing salah siji lokasi tinimbang ngluwihi aturan asli 4 gaya kita! Coba tabungan wektu iki sajrone file CSS kabeh lan sampeyan bisa ndeleng carane iki bakal nylametake sampeyan wektu lan papan ing ril adoh!
Variasi Sintaks
Sawetara wong milih nggawe CSS luwih gampang dibedakake kanthi ngisolasi saben pemilih ing baris dhewe, tinimbang nulis kabeh ing baris kaya ing ndhuwur. Iki cara sing bakal rampung:
th,
td,
p.red,
div # firstred
{
werna: abang;
}
Wigati sing sampeyan koma sawise saben pemilih banjur gunakake "ketik" kanggo ngilangi pemilih sabanjure ing baris dhewe. Sampeyan ora nambah koma sawise pamilihan pungkasan.
Kanthi nggunakake koma antarane pemilih, sampeyan nggawe sheet gaya luwih kompak sing luwih gampang dianyari ing mangsa ngarep lan luwih gampang diwaca saiki!
Artikel asli dening Jennifer Krynin. Diedit dening Jeremy Girard ing 5/8/17