[CSS] 사용자 지정 속성 var( ), 속성 값 계산 calc( )
CSS를 작성하다보면 특정 속성값을 여기저기서 반복해서 쓰는 경우가 있는데, 후에 이 속성값을 바꾸려면 이곳 저곳을 찾으면서 수정해야 하는 번거로운 과정을 거쳐야한다. 사용자 지정 속성을 사용하면 특정 속성값을 지정해놓고 필요한 영역에서 재사용할 수 있고, 수정 또한 속성값을 정해놓은 영역에서 한 번만 하면 되므로 간편하다. box라는 클래스를 가진 div를 하나 생성하고 :root라는 의사 클래스(pseudo-class)에 사용자 지정 속성의 이름과 그 값을 원하는대로 정해서 작성한 뒤 사용자 지정 속성을 사용할 곳에 var( )를 이용해서 작성하면 :root { --size-width: 50px; --size-height: 50px; --color-pink: #fd7f84; } .box { width..
CSS
2021. 5. 9. 22:29
