CSS3 상자 그림자 속성
브라우저 지원
표의 수치 속성의 버전 번호를 먼저 지원 브라우저를 나타낸다.
즉시 디지털 -webkit- 이어 -ms- 또는 접두어 지원 전 -moz- 우선 브라우저 버전 번호 때문이다.
재산 | |||||
---|---|---|---|---|---|
테두리 이미지 | 10.0 -webkit- | 9.0.0 | 4.0 (2.0) [3] 3.5 (1.9.1) -moz | 5.1 [1] 3.0 -webkit | 10.5 [1] -O- |
정의 및 지침을 속성
상자 그림자 속성은 하나 또는 그림자 상자 이상을 설정할 수 있습니다.
기본값 : | 없음 |
---|---|
상속 : | 아니 |
버전 : | CSS3 |
자바 스크립트 구문 : | 개체 .style.boxShadow = "10px 10px 5px #888888" |
문법
box-shadow:h-shadow v-shadow blur spread colorinset;
참고 : boxShadow 속성을 하나를 추가하거나 더 프레임에 그림자 할 수 있습니다.이 호텔은 그림자의 쉼표로 구분 된 목록, 2-4 길이 값, 선택 색상 값과 지정된 옵션 삽입 키워드로 음영 각이다. 길이 값을 생략하면 0이다.
값 | 설명 |
---|---|
시간 그림자 | 필요합니다. 수평 그림자의 위치. 부정적인 허용 |
V-그림자 | 필요합니다. 그림자의 세로 위치입니다. 부정적인 허용 |
흐림 | 선택 사항. 퍼지 거리 |
전파 | 선택 사항. 그림자의 크기 |
색 | 선택 사항. 그림자 색상입니다. CSS의 색상 값에 색상 값의 전체 목록을 찾을 수 있습니다 |
삽입 된 페이지 | 선택 사항. (처음에) 외층의 그림자로부터 그림자 내부 그림자를 변경하는 |
온라인 예
회전 이미지
이 예는 "폴라로이드"사진을 만들고 이미지를 회전하는 방법을 보여줍니다.
관련 기사
CSS3 튜토리얼 : CSS3 테두리