Latest web development tutorials

HTML DOM 스타일 boxShadow 속성

스타일 객체 참조 스타일 개체

div 요소에 그림자 추가 :

document.getElementById("myDIV").style.boxShadow="10px 20px 30px blue";

»시도

정의 및 사용

boxShadow 속성을 설정하거나 반환 그림자 요소를 놓습니다.


브라우저 지원

Internet ExplorerFirefoxOperaGoogle ChromeSafari

IE9 +, 파이어 폭스, 크롬, 오페라 및 사파리 5.1.1 지원 boxShadow 속성입니다.


문법

위로 boxShadow 속성 :

object .style.boxShadow

boxShadow 속성 설정 :

object .style.boxShadow="none|h-shadow v-shadow blur spread color |inset|initial|inherit"

참고 : boxShadow 속성을 하나를 추가하거나 더 프레임에 그림자 할 수 있습니다.이 호텔은 그림자의 쉼표로 구분 된 목록, 2-4 길이 값, 선택 색상 값과 지정된 옵션 삽입 키워드로 음영 각이다. 길이 값을 생략하면 0이다.

속성 값

描述
none 默认值。不显示阴影。
h-shadow 必需。水平阴影的位置。允许负值。
v-shadow 必需。垂直阴影的位置。允许负值。
blur 可选。模糊距离。
spread 可选。阴影的尺寸。
color 可选。阴影的颜色。默认值是黑色。如需了解可能的颜色值的完整列表,请参阅 CSS 颜色值

注意: 在 Safari(在 PC 上)浏览器中,color 参数是必需的。如果您未指定颜色,则不显示阴影。
inset 可选。将外部阴影(outset)改为内部阴影。
initial 设置该属性为它的默认值。请参阅 initial
inherit 从父元素继承该属性。请参阅 inherit

기술 세부 사항

기본값 : 없음
반환 값 : 상자 그림자 속성 요소를 나타내는 문자열입니다.
CSS 버전 CSS3


관련 기사

CSS 참조 설명서 : 박스 그림자 속성


스타일 객체 참조 스타일 개체