본문 바로가기

Em2

HTML/CSS] em, rem, %는 어떻게 다른가요? CSS에는 절대적인 크기를 결정하는 px, pt, 등과 상대적인 크기를 조절하는 em, rem, %가 있습니다. 이 중에서 상대적인 크기를 조절하는 단위인 em, rem, %를 비교해서 살펴보겠습니다. 이 단위들은 font의 크기를 결정할 때 뿐만이 아니라 margin, padding 등 다양한 속성에 쓰이니 알아두면 좋습니다. 아래 예제에서는 font-size와 padding을 이용해서 em, rem, %를 비교해 보겠습니다. 안녕하세요 내 이름은 '지금'이야. html { font-size: 20px; } .test2 { font-size: 30px; padding-bottom: 30px; background-color: pink; } 1. rem rem은 root요소인 의 font-size를 기준으.. 2021. 6. 3.
HTML/CSS] pt, em으로 폰트 크기 조절하기 페이지에 글자를 넣어서 사용할 때면 폰트 크기를 조절하고 싶을 때가 많습니다. CSS에서 글자의 크기를 조절하려면 font-size를 사용하면 됩니다. font-size의 단위에는 px, pt, em, %등이 있지만 가장 기본적인 방법을 사용해서 폰트크기를 조절해 보도록 하겠습니다. CSS에서 폰트 크기를 조절하는 대표적인 방법은 px, pt, em을 사용하는 것입니다. px과 pt는 절대적인 폰트의 크기를 조절할 수 있고, %와 em은 상대적인 폰트의 크기를 조절할 수 있습니다. 1. 폰트 크기 조절_ px px을 이용해서 모든 태그를 20px로 맞추어 보았습니다. 2. 폰트 크기 조절_ pt : 이번에는 pt를 사용해보겠습니다. 참고로 pt(point)는 px의 약 1.33배입니다. 3. 폰트 크기 .. 2021. 5. 14.