Bolehkah Kecerunan CSS3 Menggunakan Ketelusan Alpha?

Menggabungkan Ketelusan dan Kecerunan CSS3

CSS3 mempersembahkan gabungan keupayaan rgba dan kecerunan yang menarik. Adakah mungkin untuk memanfaatkan ciri ini bersama-sama, membenarkan kecerunan yang melaraskan ketelusan alfa dengan lancar berdasarkan spesifikasi CSS?

Jawapan:

Memang, adalah mungkin untuk menggabungkan rgba ke dalam kedua-dua pengisytiharan kecerunan webkit dan moz. Berikut ialah contoh:

Kecerunan Webkit:

background-image: -webkit-gradient(
  linear, left top, left bottom,
  from(rgba(50,50,50,0.8)),
  to(rgba(80,80,80,0.2)),
  color-stop(.5,#333333)
);

Kecerunan Mozilla (Firefox 3.6 ):

background-image: -moz-linear-gradient(
  rgba(255, 255, 255, 0.7) 0%,
  rgba(255, 255, 255, 0) 95%
);

Malah Internet Explorer menawarkan keupayaan ini menggunakan sintaks "extended hex" yang unik. Pasangan pertama dalam kod mewakili tahap kelegapan:

Kecerunan Internet Explorer:

filter: progid:DXImageTransform.Microsoft.gradient(
  startColorstr=#550000FF, endColorstr=#550000FF
);

/* IE8 */
-ms-filter: progid:DXImageTransform.Microsoft.gradient(
  startColorstr=#550000FF, endColorstr=#550000FF
);

Atas ialah kandungan terperinci Bolehkah Kecerunan CSS3 Menggunakan Ketelusan Alpha?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!