在CSS中，我们可以使用font-size属性来定义字体大小。

语法：

font-size: 像素值;

说明：

实际上，font-size属性取值有两种：一种是“关键字”，如small、medium、large等；另外一种是“像素值”，如10px、16px、21px等。

不过在实际开发中，关键字这种方式基本不会用，因此我们只需要掌握像素值方式即可。

一、px是什么？

px，全称pixel（像素），1像素指的是一张图片中最小的点，或者是计算机屏幕最小的点。

举个例子，图13-4所示是一个新浪图标。将这个图标放大后，就会变成如下图所示的样子。

我们会发现，原来一张图片是由很多的小方点组成的。其中，每一个小方点就是一个像素（px）。如果说一台屏幕的分辨率是800px×600px，指的就是“屏幕宽是800个小方点，高是600个小方点”。

严格来说，px属于相对单位，因为屏幕分辨率的不同，1px的大小也是不同的。例如Windows系统的分辨率为每英寸96px，Mac系统的分辨率为每英寸72px。如果不考虑屏幕分辨率，我们也可以把px当成绝对单位来看待，这也是为什么很多地方说px是绝对单位的原因。

对于初学者来说，1px可以看成一个小点，多少px就可以看成由多少个小点组成。

二、采用px为单位

大家比较熟悉的网站，如百度、新浪、网易等，大部分都是使用px作为单位。

稍微了解CSS的小伙伴都知道，font-size的取值单位不仅仅是px，还有em、百分比等。不过初学CSS时，我们只需要掌握px这一个就可以了。

举例：

在线测试
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        #p1 {font-size: 10px;}
        #p2 {font-size: 15px;}
        #p3 {font-size: 20px;}
    </style>
</head>
<body>
    <p id="p1">字体大小为10px</p>
    <p id="p2">字体大小为15px</p>
    <p id="p3">字体大小为20px</p>
</body>
</html>

浏览器预览效果如下图所示。