Html/CSS Transition

overflow

overflow: hidden 넘치는 부분 제거
overflow: visible 넘치면 그대로 보여주기
overflow: scroll 넘치면 스크롤바

opacity

0~1까지 투명도 조절
opacity: 0.5 반투명

transition

.box {
  opacity : 0;
  transition : all 1s;
}

적용된 css가 변할 때 서서히 변경
all은 모든 스타일이 변할 때 서서히 변경
1s는 1초에 걸처 서서히 변경

세부속성

.box {
  transition-delay: 1s; /* 시작 전 딜레이 */
  transition-duration: 0.5s; /* transition 작동 속도 */
  transition-property: opacity; /* 어떤 속성에 transition 입힐건지 */
  transition-timing-function: ease-in; /* 동작 속도 그래프조정 */
}