84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
在現在被認為是遺留的 Material 中,我可以按照以下方式設定複選框的大小:
.mat-checkbox-frame { width: 1.5rem; }
我如何在 MDC 中達到相同的效果?
要更改複選框的大小,請在styles.scss中加入以下CSS程式碼:
styles.scss
.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; /* 添加 */ }
請參考即時示範。
要更改複選框的大小,請在
styles.scss
中加入以下CSS程式碼:但是,如果您想使用預設的漣漪效果,這只是解決方案的一半。現在您還需要對齊複選框,使其完美地適應漣漪效果的圓圈中。請在
styles.scss
中加入以下CSS程式碼:請參考即時示範。