【CSS】transition

transition

마우스 포인터를 요소 위에 놓을 때 변경되는 시간을 지정할 수 있습니다.
종종 hover와 함께 사용

【CSS】hover 때 다음 동영상을 올렸습니다.



이것에 transition 를 추가해 조금 변화를 더해 보고 싶습니다

예.css

p:hover {
  background-color: red;
}

p {
  transition: all 5s;
}

어떻게 될까 하면 ...



배경색이 느긋하게 변화했습니다

セレクタ {
  transition: 変化の対象 変化にかかる時間;
}

됩니다
이번에 말하면

변화의 대상 ··· all
변화에 걸리는 시간 ··· 5s

입니다.

all은 지정된 모든 선택기로 변경됩니다.
반대로 none이면 변화시키지 않는 설정으로 할 수 있습니다.

5s는 5초에 걸쳐 변화하고 5초에 걸쳐 돌아갑니다.
5s의 s는 second (초)의 s입니다.