Rumah > hujung hadapan web > tutorial css > Adakah Terdapat Notasi Heksadesimal Ringkas untuk Warna RGBA dalam CSS?

Adakah Terdapat Notasi Heksadesimal Ringkas untuk Warna RGBA dalam CSS?

Susan Sarandon
Lepaskan: 2024-12-07 19:05:15
asal
325 orang telah melayarinya

Is There a Concise Hexadecimal Notation for RGBA Colors in CSS?

Notasi RGBA Heksadesimal CSS

Masalah: Pada masa ini, CSS menyokong tatatanda warna RGBA menggunakan nilai perpuluhan (cth., rgba(255, 0, 0 , 0.5)). Adakah terdapat cara yang lebih ringkas untuk menentukan warna separa lutsinar dalam perenambelasan?

Jawapan:

Modul Warna CSS Tahap 4 (yang kini dalam bentuk draf) dijangka untuk memperkenalkan sokongan untuk tatatanda RGBA heksadesimal 4 dan 8 digit.

Bagaimana ia Berfungsi

Notasi 8 digit:

  • 6 digit pertama mewakili nilai hex untuk saluran merah, hijau dan biru.
  • 2 digit terakhir mewakili saluran alfa, dengan 00 telus sepenuhnya dan FF sepenuhnya legap.

Notasi 4 digit:

  • Digit pertama mewakili saluran merah.
  • Tiga digit seterusnya mewakili saluran hijau, biru dan alfa, masing-masing.

Contoh

Menggunakan tatatanda 8 digit, warna heks berikut mewakili biru lutsinar sedikit:

#0000ffcc
Salin selepas log masuk

Ini bersamaan dengan yang berikut Tatatanda RGBA:

rgba(0, 0, 100%, 80%)
Salin selepas log masuk

Pelayar Sokongan

Semasa artikel ini ditulis (pada awal 2015), tiada penyemak imbas menyokong notasi warna #RRGGBBAA. Walau bagaimanapun, anda boleh menggunakan teknik sandaran berikut untuk mula menggunakannya hari ini:

figure {
  background: #FEFE7F;
  color: #3F3FFE;
  
  background: rgba(255, 255, 0, 0.5);
  color: rgba(0, 0, 255, 0.75);
  
  background: #ffff007F;
  color: #0000ffbe;      
}
Salin selepas log masuk

Atas ialah kandungan terperinci Adakah Terdapat Notasi Heksadesimal Ringkas untuk Warna RGBA dalam CSS?. 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