CSS 불투명도 / 투명성

컴프

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 8년 전 · 조회 2129 2129

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>

</body>

</html>

Image Transparency

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

Image with 50% opacity:

댓글 작성

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

로그인하기

게시판 목록

퍼블리셔팁

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

글쓰기

번호	분류	제목	글쓴이	날짜	조회
1247	레이아웃	로딩 타입 1번 스킨 및 코드 링크로 들어와서 긁어가세요. [10]	돈도없어개발하기도시러 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1615
1246	레이아웃	로딩 타입2(어제에 이어서... 그리고 개발자 설명 추가) [11]	돈도없어개발하기도시러 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1227
1245	레이아웃	버튼 UI(hover시 테두리 애니메이션 및 색깔변경) [3]	돈도없어개발하기도시러 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	2000
1244	레이아웃	로딩 타입5(글자 귀엽게 통통 요청사항) [4]	돈도없어개발하기도시러 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1514
1243	HTML	스크롤다운시 모션효과	조아웹 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1679
1242	HTML	안드로이드 아이폰 기기별 SMS 문자버튼	godmin 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1002
1241	HTML	간단한 FLEX 예제	하늘뚱 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1193
1240	HTML	간단한 반응형 페이지 레이아웃 [1]	하늘뚱 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1217
1239	HTML	간단한 Flex 활용 예제 [1]	하늘뚱 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1805
1238	CSS	가운데 정렬. 가장 심플?(정리) [1]	piadream 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1321
1237	CSS	textarea의 이런 트릭? 들어보지도 못했던? [2]	piadream 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1786
1236	CSS	css의 상속에 관한 팁입니다. [3]	제작관리홍보까지 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1741
1235	HTML	구글 검색 최적화하는 태그 입니다. [2]	제작관리홍보까지 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1205
1234	기타	GNUBOARD5에서 SVG 로딩바로 백로딩을 띄우는 코드에요 [2]	제작관리홍보까지 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	889
1233	CSS	aspect-ratio 활용하기	제작관리홍보까지 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1120
1232	기타	준비중, 공사중 임시페이지 - 마우스에 반응하며 움직이는 기하학 배경 [2]	웹사이팅 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	2139
1231	CSS	개인적으로 꼭 이해하고 넘어가야 할 것 3가지 [8]	비타주리 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1922
1230	CSS	progress 엘레먼트의 스타일링 [3]	비타주리 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1928
1229	반응형	[bootstrap5] 모바일에서 br태그 줄바꿈 기능 없애기	까투리장끼 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1227
1228	반응형	모바일에서 br태그 줄바꿈 기능 없애기 [7]	탈환대 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	4178
1227	웹접근성	웹 표준 검사하기	둠칫 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1727
1226	반응형	반응형을 위한 미디어쿼리 [2]	둠칫 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	2004
1225	CSS	Animation 동작 효과 주기 [2]	둠칫 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1571
1224	HTML	버튼 클릭시 리스트 스크롤 상단으로 이동하기	탈환대 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1664
1223	HTML	모바일 정회원 가입페이지 만들어주실분 있을까요?? [1]	위치앱 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1390
1222	CSS	body 외부 정렬	EI소프트 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1386
1221	CSS	이미지 비율대로 리사이징 하기 [1]	비타주리 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1678
1220	CSS	flex 레이아웃 [1]	네이비블루 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	2030
1219	CSS	flex 개념 이해하기 좋은 사이트 [4]	생선구이 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	1639
1218	기타	howler.js [2]	min0000 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3년 전	2494