Angular 16:我該如何改變Angular Material複選框(MDC)的大小?
P粉254077747
P粉254077747 2023-08-18 11:42:41
0
1
362

在現在被認為是遺留的 Material 中,我可以按照以下方式設定複選框的大小:

.mat-checkbox-frame { width: 1.5rem; }

我如何在 MDC 中達到相同的效果?

P粉254077747
P粉254077747

全部回覆 (1)
P粉092778585

要更改複選框的大小,請在styles.scss中加入以下CSS程式碼:

.mdc-checkbox__background { width: 1.5rem !important; height: 1.5rem !important; }

但是,如果您想使用預設的漣漪效果,這只是解決方案的一半。現在您還需要對齊複選框,使其完美地適應漣漪效果的圓圈中。請在styles.scss中加入以下CSS程式碼:

.mdc-checkbox__background { width: 1.5rem !important; height: 1.5rem !important; top: 50% !important; /* 添加 */ left: 50% !important; /* 添加 */ transform: translate(-50%, -50%) !important; /* 添加 */ }

請參考即時示範

    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板
    關於我們 免責聲明 Sitemap
    PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!