CSS 基础学习-097 css 使用font-size设置文本字体大小

由 hrs, 13 十月, 2021

font-size 属性设置文本的大小。其单位可以是：像素px，em，百分比％，vw 响应式大小。

1em等于16像素，1vw = 视口宽度的 1％。如果视口为 50 厘米宽，则 1vw 为 0.5 厘米。

实例代码:

<!doctype html>
<html>
  <head>
    <meta charset="utf-8"></meta>
    <style>
      p.p1{
        font-size:40px;
      }   
      p.p2{
        font-size:2em;
      }
      p.p3{
        font-size:50%;
      }   
      p.p4{
        font-size:5vw;
      }
      p.p5{
        color:red;
      }
    </style>

  </head>
  <body>
    <h1>font-size属性设置字体大小。</h1>
    <p class="p1">使用像素px设置文本大小</p>
    <p class="p2">使用em设置文本大小</p>
    <p class="p3">使用％设置文本大小</p>
    <p class="p4">使用vw设置响应式文本大小</p>
    <p class="p5">注：拖动浏览器窗口大小来查看字体的变化。</p>
  </body>
</html>

运行效果：

css-097.png

标签

评论