MUI是一個用于開發(fā)Web App和Hybrid App的前端框架，它提供了豐富的UI組件和工具，并支持Sass主題定制。MUI使用了類似于BEM的命名規(guī)范，并將樣式規(guī)則寫在SCSS文件中。在使用MUI時，我們還需要對其CSS文件進行深入地了解，以便更好地進行自定義和主題定制。

/**
 * Global variables
 */
$mui-namespace: "mui-" !default;
$mui-font-size: 14px !default;
$mui-border-radius: 2px !default;
$mui-line-height: 1.5 !default;
$mui-box-sizing: border-box !default;
/**
 * Core styles
 */
@include mui-core;
@include mui-appbar;
@include mui-button;
@include mui-card;
@include mui-checkbox;
@include mui-dialog;
@include mui-form;
@include mui-fab;
@include mui-grid;
@include mui-icon;
@include mui-input;
@include mui-list;
@include mui-progress;
@include mui-radio;
@include mui-searchbar;
@include mui-select;
@include mui-slider;
@include mui-switch;
@include mui-tabs;
@include mui-toasts;
@include mui-toolbar;
@include mui-typography;

CSS文件中首先定義了MUI中的全局變量，包括命名空間、字體大小、圓角大小、行高和邊框尺寸盒模型等。接著是核心樣式，其中主要包括了各種UI組件的樣式，如AppBar、Button、Card、Checkbox等等。這些樣式大部分都是由mixin組成的，方便我們進行修改和擴展。

如果我們需要自定義MUI的主題樣式，可以使用Sass進行覆蓋。例如，如果想修改按鈕的顏色，只需要復制以上CSS中的@include mui-button;到自己的Sass文件中：

.my-button {
// 自定義樣式
@include mui-button;
// 覆蓋變量
$mui-button-color: #ff0000;
}

通過這種方式，我們可以方便地進行樣式擴展和主題定制。