CODEDRAGON ㆍDevelopment/Web, WWW
box-shadow 속성
선택한 요소에 그림자 효과 추가하기
box-shadow : inset 5px -5px 10px 15px #000000; |
구분 |
설명 |
inset |
· 박스의 그림자가 안쪽으로 퍼지게 합니다 |
5px |
· 가로 오프셋 거리 (가로로 밀리는 폭) · 그림자가 가로로 얼마나 떨어져 있는지 지정 · 양수값은 요소의 오른 쪽에 그림자 표시 · 음수값은 요소의 왼쪽에 그림자 표시 |
-5px |
· 세로 오프셋 거리 (세로로 밀리는 폭) · 그림자가 세로로 얼마나 떨어져 있는지 지정. · 양수값은 요소의 아래에 그림자 표시 · 음수값은 요소의 위쪽에 그림자 표시 |
10px |
· blur radius · 그림자의 번지는 정도를 지정. · 0이 최소값이며 이 값을 생략하면 번지는 효과를 사용하지 않습니다. |
15px |
· 그림자와 박스의 거리 |
#000000 |
· 그림자 색상을 지정 · 16진수로 된 색상값, 색상 이름이나 RGB 값 모두 사용가능 · rgba(red, green, blue, 투명도) |
'Development > Web, WWW' 카테고리의 다른 글
list(리스트), 리스트 종류-순서 없는 리스트(Unordered Lists). 순서 있는 리스트(Ordered Lists), type속성, 마커(marker) (0) | 2017.06.14 |
---|---|
브라우저별 CSS 차이 확인하기 (0) | 2017.06.14 |
border-radius 프로퍼티, border-radius 속성값, border-radius 속성 형식 (0) | 2017.06.14 |
border - 테두리 관련 프로퍼티 (0) | 2017.06.14 |
border-color 프로퍼티 (0) | 2017.06.14 |