小程序之樣式

//index.wxml

<view class="contain" >test import 樣式</view>

//index.wxss

@import "../helloworld/helloworld.wxss";

.contain{

? border: 1px;

}

//helloworld.wxss

.contain{

? color: red;

}


樣式導(dǎo)入

使用@import語(yǔ)句可以導(dǎo)入外聯(lián)樣式表,@import后跟需要導(dǎo)入的外聯(lián)樣式表的相對(duì)路徑,用;表示語(yǔ)句結(jié)束。

內(nèi)聯(lián)樣式

框架組件上支持使用 style、class 屬性來(lái)控制組件的樣式。

style:靜態(tài)的樣式統(tǒng)一寫(xiě)到 class 中。style 接收動(dòng)態(tài)的樣式,在運(yùn)行時(shí)會(huì)進(jìn)行解析,請(qǐng)盡量避免將靜態(tài)的樣式寫(xiě)進(jìn) style 中,以免影響渲染速度。

class:用于指定樣式規(guī)則,其屬性值是樣式規(guī)則中類(lèi)選擇器名(樣式類(lèi)名)的集合,樣式類(lèi)名不需要帶上.,樣式類(lèi)名之間用空格分隔


全局樣式與局部樣式

定義在 app.wxss 中的樣式為全局樣式,作用于每一個(gè)頁(yè)面。在 page 的 wxss 文件中定義的樣式為局部樣式,只作用在對(duì)應(yīng)的頁(yè)面,并會(huì)覆蓋 app.wxss 中相同的選擇器。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 視圖層 框架的視圖層由WXML(WeiXin Markup language)與WXSS(WeiXin Style...
    勇敢的_心_閱讀 1,761評(píng)論 0 6
  • Spring Cloud為開(kāi)發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見(jiàn)模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,539評(píng)論 19 139
  • WXSS(WeiXin Style Sheets)是一套樣式語(yǔ)言,用于描述 WXML 的組件樣式。WXSS 用來(lái)決...
    肉肉要次肉閱讀 10,050評(píng)論 0 2
  • 今天考試終于結(jié)束了,說(shuō)實(shí)話(huà)這次真的著難啦,以前每一次考試都沒(méi)有把他當(dāng)成一回事,可是這一次真的是噥的頭疼。可能也是沒(méi)...
    李嘉馳閱讀 141評(píng)論 0 0
  • 人類(lèi)的生活條件正在不斷提高,購(gòu)物的需求量也越來(lái)越高,于是一次性塑料袋被發(fā)明了出來(lái)。這樣一來(lái)雖然是方便了不少...
    十一月的緣分閱讀 103評(píng)論 0 0

友情鏈接更多精彩內(nèi)容