在 NativeScript 中使用 tailwindcss 时，有时会使用各种 tailwindcss 字体大小，例如 text lg、text 3xl。 不过，tailwindcss 会自动应用 line height。 <https://tailwindcss.com/docs/font size 在 iOS 中
在 NativeScript 中使用 tailwindcss 时，有时会使用各种 tailwindcss 字体大小，例如 text-lg、text-3xl。
不过，tailwindcss 会自动应用 line-height。
https://tailwindcss.com/docs/font-size
Font Size
Utilities for controlling the font size of an element.
text-xs font-size: 0.75rem; /* 12px */
line-height: 1rem; /* 16px */
text-sm font-size: 0.875rem; /* 14px */
line-height: 1.25rem; /* 20px */
text-base font-size: 1rem; /* 16px */
line-height: 1.5rem; /* 24px */
text-lg font-size: 1.125rem; /* 18px */
line-height: 1.75rem; /* 28px */
text-xl font-size: 1.25rem; /* 20px */
line-height: 1.75rem; /* 28px */
text-2xl font-size: 1.5rem; /* 24px */
line-height: 2rem; /* 32px */
text-3xl font-size: 1.875rem; /* 30px */
line-height: 2.25rem; /* 36px */
text-4xl font-size: 2.25rem; /* 36px */
line-height: 2.5rem; /* 40px */
text-5xl font-size: 3rem; /* 48px */
line-height: 1;
text-6xl font-size: 3.75rem; /* 60px */
line-height: 1;
text-7xl font-size: 4.5rem; /* 72px */
line-height: 1;
text-8xl font-size: 6rem; /* 96px */
line-height: 1;
text-9xl font-size: 8rem; /* 128px */
line-height: 1;在 iOS 中，lineHeight 这个选项会导致布局问题。
因此，上面的发帖者也表达了这个问题。 上面的发帖者表示，行高应当恰好比字体大小大 2px。
于是我修改了 tailwind.config.js，尽可能减轻了这个问题。
theme: {
extend: {
fontSize: {
'xs': ['0.75rem', { lineHeight: '0.875rem' }], // 12px font-size, 14px line-height
'sm': ['0.875rem', { lineHeight: '1rem' }], // 14px font-size, 16px line-height
'base': ['1rem', { lineHeight: '1.125rem' }], // 16px font-size, 18px line-height
'lg': ['1.125rem', { lineHeight: '1.25rem' }], // 18px font-size, 20px line-height
'xl': ['1.25rem', { lineHeight: '1.375rem' }], // 20px font-size, 22px line-height
'2xl': ['1.5rem', { lineHeight: '1.625rem' }], // 24px font-size, 26px line-height
'3xl': ['1.875rem', { lineHeight: '2rem' }], // 30px font-size, 32px line-height
'4xl': ['2.25rem', { lineHeight: '2.375rem' }], // 36px font-size, 38px line-height
'5xl': ['3rem', { lineHeight: '3.125rem' }], // 48px font-size, 50px line-height
'6xl': ['3.75rem', { lineHeight: '3.875rem' }], // 60px font-size, 62px line-height
'7xl': ['4.5rem', { lineHeight: '4.625rem' }], // 72px font-size, 74px line-height
'8xl': ['6rem', { lineHeight: '6.125rem' }], // 96px font-size, 98px line-height
'9xl': ['8rem', { lineHeight: '8.125rem' }], // 128px font-size, 130px line-height
},
lineHeight: {
'normal': 'normal',
},
},
},应用此选项后，即使使用 tailwindcss 的 text-lg，也会应用适合 iOS 的行高，因此即使使用 tailwindcss 的默认文本大小，也能避免布局问题。