Rumah >hujung hadapan web >tutorial css >Penjelasan terperinci tentang sifat CSS: sifat warna

Penjelasan terperinci tentang sifat CSS: sifat warna

WBOY
WBOYasal
2023-10-25 10:57:32847semak imbas

CSS 属性详解:颜色属性

Penjelasan terperinci tentang sifat CSS: Sifat warna

CSS (Cascading Style Sheet) ialah bahasa penanda yang digunakan untuk menerangkan gaya halaman web. Antaranya, atribut warna adalah salah satu atribut yang paling biasa digunakan dalam CSS. Dengan menggunakan atribut warna, kita boleh menukar warna teks, warna latar belakang, warna sempadan, dll. elemen pada halaman untuk mencapai kesan visual dan pengindahan.

1. Cara menyatakan nilai warna

Dalam CSS, terdapat banyak cara untuk menyatakan nilai warna, termasuk yang berikut:

  1. Nama warna: dinyatakan dengan merujuk nama warna yang telah ditetapkan, contohnya, "merah" mewakili merah , "hijau" mewakili hijau.
  2. Nilai RGB: RGB ialah gabungan warna merah, hijau dan biru, yang boleh diwakili dengan nombor. Julat nilai ialah 0~255, yang boleh diwakili oleh fungsi rgb() Contohnya, rgb(255, 0, 0) mewakili merah.
  3. Nilai Heksadesimal: Warna juga boleh diwakili dalam perenambelasan, yang terdiri daripada tiga atau enam digit perenambelasan. Setiap aksara heksadesimal sepadan dengan komponen tertentu dalam RGB, contohnya #FF0000 mewakili merah.

2. Aplikasi atribut warna

  1. Warna teks (warna)

Dengan menetapkan atribut warna, anda boleh menukar warna teks. Contohnya:

p {
  color: blue;
}

Pada ketika ini, teks dalam semua elemen p akan kelihatan biru.

  1. Warna latar belakang (warna latar belakang)

Dengan menetapkan atribut warna latar belakang, anda boleh menukar warna latar belakang elemen. Contohnya:

div {
  background-color: #FF0000;
}

Pada ketika ini, warna latar belakang semua elemen div akan menjadi merah.

  1. Warna sempadan (warna sempadan)

Dengan menetapkan atribut warna sempadan, anda boleh menukar warna sempadan elemen. Contohnya:

button {
  border-color: green;
}

Pada masa ini, warna sempadan semua elemen butang akan bertukar kepada hijau.

  1. Warna pautan (a:pautan, a:dilawati, a:legar, a:aktif)

Dengan menetapkan atribut warna pautan, anda boleh mengawal warna pautan dalam keadaan berbeza. Contohnya:

a:link {
  color: blue;
}

a:visited {
  color: purple;
}

a:hover {
  color: red;
}

a:active {
  color: green;
}

Pada masa ini, pautan diwakili sebagai biru (tidak dilawati), ungu (dilawati), merah (menunduk tetikus) dan hijau (diklik).

3. Ketelusan Warna

Dalam CSS3, kita juga boleh mencapai kesan lut sinar unsur dengan menetapkan atribut ketelusan warna. Ketelusan dinyatakan dalam format RGBA atau HSLA, dengan A mewakili ketelusan, dan julat nilai ialah 0~1. Contohnya:

div {
  background-color: rgba(255, 0, 0, 0.5);
}

Pada ketika ini, latar belakang elemen akan menjadi merah dan separa lutsinar, dengan ketelusan 50%.

4. Ringkasan

Atribut warna digunakan secara meluas dalam CSS Dari warna teks kepada warna latar belakang, warna sempadan, dll., semuanya boleh dicapai melalui atribut ini. Pada masa yang sama, kita juga boleh mencapai kesan lutsinar unsur dengan menetapkan ketelusan. Menguasai penggunaan atribut warna boleh membolehkan kami mencantikkan halaman web dengan lebih baik dan meningkatkan pengalaman pengguna.

Atas ialah kandungan terperinci Penjelasan terperinci tentang sifat CSS: sifat warna. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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