欧美日韩中文一区二区,亚洲天堂av在线,亚洲最大成人免费视频,欧美最新精品

微信小程序WXSS樣式介紹

微信小程序開發中,需要用到一種微信自己推出的一套樣式語言——WXSS(WeiXin Style Sheets),它用于描述WXML的組件樣式,也就是說用來決定WXML的組件應該怎么顯示。那么今天小程序觀察網小編就和各位開發者一起聊聊微信小程序WXSS樣式語言。

開發者開發微信小程序,需要對小程序的界面進行排版,此時就要用到WXML和WXSS了。WXML指定了界面的框架結構,而WXSS起到的作用就是指定界面的框架及元素的顯示樣式。

按照微信官方的介紹,WXSS具有CSS的大部分特性,并且在CSS的基礎上進行了擴充和修改,以適合廣大的前端開發者開發微信小程序。CSS的特性和使用方法想必開發朋友都清楚,這里就不介紹了。既然官方說WXSS具有CSS的大部分特性,那就說明還是有部分是不同的,小編就來整理一下哪些地方不同。

差別一:沒有body

小程序的每一個page里都沒有body屬性,要想影響整個頁面的樣式可以通過在WXSS中對page進行設置來實現。

差別二:尺寸變化

在CSS里衡量尺寸的單位有很多,比如px、em等,而WXSS里除了這些外,還新增了一個單位:rpx。它最重要的特性是可以根據屏幕寬度進行自適應,畢竟小程序作為在移動端展現需要適配各種規格的移動設備。官方介紹,規定屏幕寬為750rpx,如在 iPhone6 上,屏幕寬度為375px,共有750個物理像素,則750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。

差別三:樣式導入

小程序WXSS支持樣式的導入,比如我們使用一些其他庫的時候就可以直接導入第三方的WXSS文件,這是一個相當有用的功能。

差別四:內聯樣式

WXSS和CSS一樣支持class和style兩種樣式,但用法上有一些區別。按照官方的說法概括為:樣式中存在動態內容,就寫道style中,其他的都放到class文件。

差別五:選擇器

微信小程序WXSS樣式語言

如官方介紹,WXSS基本支持CSS中的選擇,而且類似于last-child之類的css的高級屬性,也可以在WXSS中使用。

差別六:全局樣式與局部樣式

在小程序中,一般一個WXSS負責一個WXML視圖文件,但一個應用難免會有一些共用的屬性,所以小程序為應用自身提供了一個WXSS—app.wxss,它不用人工引入,會自動的加載到每一個視圖上。

總之,小程序樣式語言WXSS具有了CSS大部分屬性,而且還拓展了尺寸單位和樣式導入等特性,更適合開發微信小程序。對于熟悉CSS的開發者來說WXSS上手并沒有太大難度,當然更多的細節差別還有待開發朋友們多挖掘探索。


聲明:本站部分文章來源于互聯網,如有侵犯作者著作權,請及時與我們聯系。

木魚小鋪小程序

為您推薦

主站蜘蛛池模板: 云和县| 石门县| 上虞市| 德化县| 白朗县| 新巴尔虎左旗| 祁东县| 辽源市| 富裕县| 武胜县| 东阿县| 汤阴县| 孟连| 白玉县| 盘山县| 卫辉市| 郁南县| 集安市| 云浮市| 蓝田县| 张家港市| 罗城| 安义县| 黄冈市| 新化县| 长宁县| 东城区| 阿克陶县| 黔西| 阜新| 东丰县| 湟中县| 宜兰市| 揭阳市| 霞浦县| 潞西市| 庐江县| 庆城县| 延吉市| 霍林郭勒市| 鄂托克旗|