Rumah > hujung hadapan web > tutorial css > Apakah itu Sifat Tersuai CSS (Pembolehubah) dan Bagaimanakah Awalan Double-Dash Berfungsi?

Apakah itu Sifat Tersuai CSS (Pembolehubah) dan Bagaimanakah Awalan Double-Dash Berfungsi?

Mary-Kate Olsen
Lepaskan: 2024-11-23 00:29:18
asal
825 orang telah melayarinya

What are CSS Custom Properties (Variables) and How Do Double-Dash Prefixes Work?

Memahami Sifat CSS Tersuai yang Diawali dengan Sengkang Berganda

Dalam coretan kod yang anda berikan, anda menemui sifat CSS yang diawali dengan sempang berganda (--) , seperti --color-link dan --font-thin. Sifat ini tergolong dalam satu set sifat tersuai CSS, yang merupakan sifat yang ditentukan pengguna yang membenarkan fleksibiliti dan penyesuaian yang lebih besar dalam penggayaan CSS.

Menurut spesifikasi W3C pada sifat tersuai, sifat awalan dua sempang ini ditakrifkan menggunakan sintaks berikut:

--<property-name>: <value>;
Salin selepas log masuk

di mana --property-name ialah nama harta tersuai dan ialah nilai yang diingini untuk sifat tersebut.

Sifat tersuai mempunyai beberapa tujuan:

  • Fleksibiliti gaya: Mereka membenarkan pengubahsuaian mudah sifat CSS merentas berbilang elemen, mengurangkan keperluan untuk pengisytiharan berlebihan.
  • Pengurusan tema: Tersuai sifat boleh digunakan untuk mentakrifkan pembolehubah khusus tema, memudahkan proses penukaran antara tema yang berbeza.
  • Penggantian pembolehubah: Mereka membolehkan penggunaan pembolehubah sebagai nilai untuk sifat CSS lain, memberikan peningkatan fleksibiliti dalam penggayaan.

Menggunakan fungsi var(), anda boleh mengakses nilai sifat tersuai dalam pengisytiharan CSS lain. Sebagai contoh, dalam kod berikut, sifat warna unsur #foo h1 ditetapkan kepada nilai sifat tersuai --warna utama:

#foo h1 {
  color: var(--main-color);
}
Salin selepas log masuk

Maklumat Rujukan

  • [Sifat Tersuai W3C Spec](https://www.w3.org/TR/css-variables/)
  • [MDN Web Docs: CSS Custom Properties](https://developer.mozilla.org/en-US/ docs/Web/CSS/Using_CSS_custom_properties)
  • [Helah CSS: Semua Mengenai Tersuai Hartanah](https://css-tricks.com/custom-properties-all-the-things/)

Atas ialah kandungan terperinci Apakah itu Sifat Tersuai CSS (Pembolehubah) dan Bagaimanakah Awalan Double-Dash Berfungsi?. 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