时间戳

首页 > 解决方案 > 如何将基本字体大小覆盖为 62.5%？

css - 如何将基本字体大小覆盖为 62.5%？

问题描述

我正在尝试将基本字体大小覆盖为 62.5%。我在tailwind.config.js 中添加了这段代码——

plugins: [
    plugin(function ({ addUtilities }) {
        addUtilities({
            'html': {
                'font-size': '62.5%'
            }
        });
    })
]

使用这种方法，我项目中的所有字体看起来都很小，而其他类（如边距，填充使用这 62.5% 作为基本单位）。

为了使它工作，我必须手动将他们现有的类覆盖到 tailwind.config.js 中的新单元，这太耗时了。有没有更好的解决方案将顺风基本字体大小转换为 62.5%？

plugins: [
    plugin(function ({ addUtilities }) {
        addUtilities({
            'html': {
                'font-size': '62.5%'
            },
            '.text-xs': {
                'font-size': '1.2rem',
                'line-height': '1.6rem'
            },
            '.text-sm': {
                'font-size': '1.4rem',
                'line-height': '2rem'
            },
            '.text-base': {
                'font-size': '1.5rem',
                'line-height': '1.8rem'
            },
            ....
        });
    })
]

标签： csstailwind-css

解决方案

Tailwind 将此作为内置配置。你可能需要做一些基本的数学运算。https://tailwindcss.com/docs/font-size#font-sizes

推荐阅读