728x90
box-shadow는 선택한 요소에 그림자 효과를 만들어주는 속성!
box-shadow: none | x-position y-position blur spread color | inset | initial | inherit
- none: 그림자 제거
- x-position : 가로 위치입니다. 양수면 오른쪽에, 음수면 왼쪽에 그림자가 만들어집니다. (필수)
- y-position : 세로 위치입니다. 양수면 아래쪽에, 음수면 위쪽에 그림자가 만들어집니다. (필수)
- blur : 그림자를 흐릿하게 만듭니다. 값이 클 수록 더욱 흐려집니다.
- spread : 양수면 그림자를 확장하고, 음수면 축소합니다.
- color : 그림자 색을 정합니다.
- inset : 그림자를 요소의 안쪽에 만듭니다.
- initial : 기본값으로 설정합니다.
- inherit : 부모 요소의 속성값을 상속받습니다.
예제
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.5);
728x90
'WEB > CSS' 카테고리의 다른 글
| label로 체크모양 만들기 (0) | 2020.02.13 |
|---|---|
| HTML 과 CSS 기초 (0) | 2020.02.04 |
| div 글자수 제한 css (0) | 2020.01.20 |
| radio box css변경 (0) | 2020.01.03 |
| [css] placeholder 디자인 변경 (0) | 2019.12.24 |