微信小程序作為一款輕量級應(yīng)用，其開發(fā)過程中對代碼的精簡和優(yōu)化顯得格外重要。而CSS的導(dǎo)入，就是其中的一個關(guān)鍵問題。

// app.wxss
@import "./common/reset.wxss"; 
@import "./common/font.wxss";
// index.wxss
.container {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #f8f8f8;
}
.title {
font-size: 32rpx;
font-weight: bold;
color: #333;
margin-bottom: 20rpx;
}
.button {
width: 200rpx;
height: 64rpx;
background-color: #4e7ff2;
color: #fff;
font-size: 28rpx;
text-align: center;
line-height: 64rpx;
border-radius: 32rpx;
}

在微信小程序的開發(fā)中，可以通過"@import"的方式，在主WXSS文件中引入其他WXSS文件。

如上述代碼所示，我們在app.wxss文件中用"@import"的方式引入了common文件夾下的reset.wxss和font.wxss兩個文件。

同時，在index.wxss文件中定義了.container、.title、.button三個選擇器，用來設(shè)置樣式。

需要注意的是，在小程序開發(fā)中，所有規(guī)則必須先定義組件。樣式定義順序為：組件樣式 >引用組件的外層樣式 >引用當(dāng)前頁面的樣式。

因此，我們需要先把容器.container定義好，再在.container內(nèi)部定義其他元素的樣式。

除此之外，小程序提供了一系列rpx單位，用來精確適配不同屏幕大小和分辨率，建議開發(fā)者盡可能地使用rpx而不是px。

總之，在微信小程序的開發(fā)中，CSS的導(dǎo)入和樣式的設(shè)置十分重要，需要開發(fā)者認(rèn)真思考并精心設(shè)置。