css字体大小随浏览器窗口

在网页设计中，字体大小是非常重要的一部分。但是，不同的浏览器和设备的屏幕尺寸却不相同，这就需要我们使用一些技巧来让字体大小根据浏览器窗口大小自动调整。

CSS提供了两种方法来控制字体大小：

    font-size: 数值;
    font-size: 百分比;

其中，font-size: 数值;是指设置字体大小的具体数值，而font-size: 百分比;将字体大小设置为相对于父元素的百分比数值。

下面我们来演示如何使用font-size: 百分比;来实现字体大小随浏览器窗口自动调整的效果：

    html {
        font-size: 16px;
    }

    @media screen and (min-width: 320px) {
        html {
            font-size: 12px;
        }
    }

    @media screen and (min-width: 480px) {
        html {
            font-size: 14px;
        }
    }

    @media screen and (min-width: 768px) {
        html {
            font-size: 16px;
        }
    }

    @media screen and (min-width: 992px) {
        html {
            font-size: 18px;
        }
    }

    @media screen and (min-width: 1200px) {
        html {
            font-size: 20px;
        }
    }

    body {
        font-size: 1em; /* 1em相当于父元素的字体大小 */
    }

以上代码使用了CSS3的media查询，来根据不同的浏览器窗口大小设定不同的html字体大小。

最后，我们将body的字体大小设为1em，也就是相对于html父元素的字体大小，这样就可以让字体大小随浏览器窗口大小自动调整。

总的来说，通过使用font-size: 百分比;和media查询，我们可以轻松实现字体大小随着浏览器窗口大小自动调整的效果。