컴

CSS 불투명도 / 투명성

· 2017-06-05 (월) 17:16:07 · 2527

CSS 불투명도 / 투명성

 

이 opacity속성은 요소의 불투명도 / 투명도를 지정합니다.

 

투명한 이미지

이 opacity속성은 0.0 - 1.0의 값을 가질 수 있습니다. 값이 낮을수록 투명합니다.

 


숲

불투명도 0.2

숲

불투명도 0.5

숲

 

불투명도 1 
(기본값)

 




참고 : IE8 및 이전 버전이 사용 filter:alpha(opacity=x)됩니다. x는 0 - 100의 값을 취할 수 있습니다. 값이 낮을수록 요소가 더 투명 해집니다.


예

img {

    opacity: 0.5;

    filter: alpha(opacity=50); /* For IE8 and earlier */

}



<!DOCTYPE html>

<html>

<head>

<style>

img {

    opacity: 0.5;

    filter: alpha(opacity=50); /* For IE8 and earlier */

}

</style>

</head>

<body>


<h1>Image Transparency</h1>

<p>The opacity property specifies the transparency of an element. The lower the value, the more transparent:</p>


<p>Image with 50% opacity:</p>

<img src="img_forest.jpg" alt="Forest" width="170" height="100">


</body>

 

</html>



Image Transparency

The opacity property specifies the transparency of an element. The lower the value, the more transparent:

Image with 50% opacity:

Forest
|
댓글을 작성하시려면 로그인이 필요합니다.

퍼블리셔팁

1,282건

퍼블리싱과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
CSS 17-07-18 조회 2,428
CSS 17-07-18 조회 2,501
CSS 17-06-13 조회 3,979
CSS 17-06-13 조회 3,336
CSS 17-06-13 조회 2,569
CSS 17-06-08 조회 2,055
CSS 17-06-08 조회 2,494
CSS 17-06-08 조회 1,985
CSS 17-06-06 조회 5,686
CSS 17-06-05 조회 3,638
CSS 17-06-05 조회 3,450
CSS 17-06-05 조회 2,528
HTML 17-06-02 조회 3,495
HTML 17-05-26 조회 3,935
CSS 17-05-05 조회 2,831
CSS 17-05-05 조회 2,313
CSS 17-05-05 조회 2,086
CSS 17-05-04 조회 3,074
CSS 17-05-04 조회 2,965
CSS 17-05-04 조회 3,468
CSS 17-04-10 조회 2,161
CSS 17-04-10 조회 1,847
CSS 17-04-10 조회 2,614
CSS 17-04-05 조회 2,262
CSS 17-04-05 조회 2,540
CSS 17-04-05 조회 2,536
CSS 17-04-04 조회 2,421
CSS 17-04-04 조회 2,586
CSS 17-04-04 조회 2,681
CSS 17-03-13 조회 3,250