본문 바로가기

프로그래밍/HTML5

em태그

 

<!DOCTYPE html>
<html>
   <meta charset="utf-8">
   <head>
      <title>크기 조절 %태그</title>
      <style>
         p:nth-child(1) {font-size:0.5em;}
         p:nth-child(2) {font-size:1.0em;}
         p:nth-child(3) {font-size:1.5em;}
         p:nth-child(4) {font-size:2.0em;}
      </style>
   </head>
   <body>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
   </body>

</html>

 

em으로 글자 크기를 조절할수있다.

0.5 -> 0.5배

1.0 -> 1배

1.5 -> 1.5배

2.0 -> 2배

 

'프로그래밍 > HTML5' 카테고리의 다른 글

px태그  (0) 2017.09.20
%태그  (0) 2017.09.20
배경색상  (0) 2017.09.20
radius  (0) 2017.09.20
padding,margin  (0) 2017.09.20