Rumah > hujung hadapan web > tutorial css > Kelas CSS: Ruang vs. Tiada Ruang—Apakah Perbezaannya?

Kelas CSS: Ruang vs. Tiada Ruang—Apakah Perbezaannya?

Susan Sarandon
Lepaskan: 2024-12-15 07:07:11
asal
488 orang telah melayarinya

CSS Classes: Space vs. No Space—What's the Difference?

Kelas CSS: Dengan Ruang lwn. Tanpa Ruang

Dalam CSS, terdapat dua cara untuk menulis pemilih kelas: dengan ruang (.class .class) dan tanpa ruang (.class.class). Setiap sintaks mempunyai tujuan yang berbeza.

Tanpa Ruang: .class.class

Sintaks ini menunjukkan bahawa elemen mesti mempunyai kedua-dua kelas untuk dipadankan dengan pemilih. Contohnya, .element.large .symbol akan memilih mana-mana elemen .symbol yang berada dalam elemen .element yang juga mempunyai kelas besar.

Dengan Ruang: .class .class

Sintaks ini menunjukkan bahawa elemen mesti mempunyai kedua-dua kelas dalam sebarang susunan. Contohnya, .element .symbol akan memilih mana-mana elemen .symbol yang berada dalam elemen .element. Walau bagaimanapun, ia juga akan memilih mana-mana elemen .elemen yang mempunyai kelas .symbol, tanpa mengira kedudukannya dalam dokumen.

Contoh:

Pertimbangkan CSS berikut:

.element {
  color: black;
}

.large {
  font-size: 2em;
}

.symbol {
  font-family: monospace;
}
Salin selepas log masuk
  • .elemen .simbol akan memilih semua elemen .simbol yang berada dalam .elemen elemen, dan mereka akan mewarisi warna: gaya hitam daripada .element.
  • .element.large .symbol akan memilih semua elemen .symbol yang berada dalam .elemen elemen yang juga mempunyai kelas besar, dan mereka akan mewarisi warna: hitam dan saiz fon: gaya 2em.

Atas ialah kandungan terperinci Kelas CSS: Ruang vs. Tiada Ruang—Apakah Perbezaannya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan