[CSS] Box Shadow, Opacity, Overflow, Visibility

1. box shadow

• 요소에게 그림자를 줄 때 사용
• neumorphism.io 사이트 참고

p {
 box-shadow: x y 흐린정도 그림자사이즈 색상
}

2.Opacity : 투명도

• 0(투명) ~ 1(불투명)

3. Overflow

width와 height를 가진 요소안의 자식요소들이 크기를 벗어났을 때 어떻게 처리할 것인가?
overflow: *visible | auto | scroll | hidden
(1) visible : 기본값, 그냥 벗어난 것을 그대로 보여주는 것
(2) auto, scroll : 넘쳐흐른것들은 스크롤로 바꾼다.(둘이별차이가없음)
(3) hidden : 넘쳐흐른것들은 스크롤도 안생기고 다 없애버린다.

개별적으로 줄 수 있다.
overflow-x: scroll; (가로에 스크롤줄때)
overflow-y: hidden;
가로로는 스크롤을 주지만 y축으로는 넘쳐흐르는것들은 숨긴다.

4. Visibility

요소를 보여줄 것 인지 숨길 것 인지 지정
visibility: *visible | hidden

• hidden = opaicty:0 과 비슷함
• hidden을 하여도 숨겨진 자리가 계속 유지됨
  vs display: none; 숨겨진 자리가 유지가 안됨(존재하지않음)