CSS3 그라디언트는 알파 투명도를 사용할 수 있습니까?

CSS3 투명도와 그라데이션 결합

CSS3은 rgba와 그라데이션 기능의 흥미로운 조합을 제공합니다. 이러한 기능을 함께 활용하여 CSS 사양에 따라 알파 투명도를 원활하게 조정하는 그라디언트를 허용할 수 있습니까?

답변:

실제로 통합이 가능합니다. rgba를 웹킷과 moz 그래디언트 선언에 모두 포함합니다. 예는 다음과 같습니다.

Webkit Gradient:

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)
);

Mozilla Gradient(Firefox 3.6 ):

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

Internet Explorer에서도 고유한 "확장 16진수"를 사용하여 이 기능을 제공합니다. 구문. 코드의 첫 번째 쌍은 불투명도 수준을 나타냅니다.

Internet Explorer 그라데이션:

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

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

위 내용은 CSS3 그라디언트는 알파 투명도를 사용할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!