如何同时调整字体与Checkbox大小？现有代码仅修改字体

要同时缩小Checkbox的尺寸和关联文本的字体大小，你需要针对Checkbox的容器和图标部分单独设置样式——你之前的代码只修改了文本字体，没有触碰到Checkbox本身的尺寸控制样式。

可以尝试添加以下CSS规则：

/* 调整Checkbox的容器尺寸 */
.mud-checkbox {
    width: 18px;
    height: 18px;
}

/* 调整Checkbox内部图标的大小 */
.mud-checkbox-icon {
    font-size: 12px;
    width: 14px;
    height: 14px;
}

/* 确保关联文本的字体大小生效（精准限定作用范围） */
.mud-checkbox-label .mud-typography-body1 {
    font-size: 14px !important;
}

说明： #

• .mud-checkbox 是Checkbox的外层容器，控制整体点击区域和基础尺寸
• .mud-checkbox-icon 是勾选图标的容器，调整它的尺寸和字体大小可以缩小勾选标记的显示
• 最后一条规则用于确保字体大小设置只作用于Checkbox关联的文本，避免全局影响其他.mud-typography-body1元素

你可以根据实际布局需求，自行调整width、height和font-size的具体数值。

内容的提问来源于stack exchange，提问作者TheBoubou