淺談微信小程序之官方UI框架we-ui使用教程
WeUI 是一套同微信原生視覺體驗(yàn)一致的基礎(chǔ)樣式庫(kù)，由微信官方設(shè)計(jì)團(tuán)隊(duì)為微信內(nèi)網(wǎng)頁(yè)和微信小程序量身設(shè)計(jì)，令用戶的使用感知更加統(tǒng)一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。
首先先看一下這套框架的GItHub地址
1.從git上clone到本地
太簡(jiǎn)單的東西我就不解釋了,直接講怎么用吧
這是解壓后的目錄
2.新建一個(gè)項(xiàng)目
將 dist/style/目錄下的weui.wxss 放到新項(xiàng)目的根目錄下,如下圖所示
3.在app.wxss中引入weui.wxss文件
至此,準(zhǔn)備工作就完成了,已經(jīng)可以使用官方的樣式了
接下來(lái)看一下如何查看示例代碼,我們將clone下來(lái)的示例代碼導(dǎo)入到微信小程序開發(fā)工具中
導(dǎo)入的目錄是src/example
然后就可以看到示例代碼了
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
使用JavaScript實(shí)現(xiàn)按鈕的漣漪效果實(shí)例代碼
近來(lái)看到個(gè)不錯(cuò)的按鈕點(diǎn)擊效果,當(dāng)點(diǎn)擊時(shí)產(chǎn)生一次水波漣漪效果,挺好玩的,下面這篇文章主要給大家介紹了關(guān)于使用JavaScript實(shí)現(xiàn)按鈕漣漪效果的相關(guān)資料,需要的朋友可以參考下2022-11-11
webpack?打包后圖片加載報(bào)錯(cuò)的解決辦法
使用webpack打包后,圖片沒(méi)有加載出來(lái),頁(yè)面空白,報(bào)錯(cuò)圖片引用的路徑不對(duì),本文給大家介紹webpack?打包后圖片加載報(bào)錯(cuò)的解決辦法,感興趣的朋友一起看看吧2024-03-03
惰性函數(shù)定義模式 使用方法...2007-09-09
JS?簡(jiǎn)單實(shí)現(xiàn)拖拽評(píng)星的示例代碼
本文主要介紹了JS?簡(jiǎn)單實(shí)現(xiàn)拖拽評(píng)星，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
這篇文章主要介紹了微信小程序 Storage更新詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-07-07
淺談JavaScript的幾種繼承實(shí)現(xiàn)方式
本文主要介紹了淺談JavaScript的幾種繼承實(shí)現(xiàn)方式，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-04-04
JS+CSS實(shí)現(xiàn)動(dòng)態(tài)時(shí)鐘
這篇文章主要為大家詳細(xì)介紹了JS+CSS實(shí)現(xiàn)動(dòng)態(tài)時(shí)鐘，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-02-02
JS實(shí)現(xiàn)IE狀態(tài)欄文字縮放效果代碼
這篇文章主要介紹了JS實(shí)現(xiàn)IE狀態(tài)欄文字縮放效果代碼,涉及JavaScript針對(duì)瀏覽器的相關(guān)調(diào)用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10
非常不錯(cuò)的三種簡(jiǎn)潔的Tab導(dǎo)航（網(wǎng)頁(yè)選項(xiàng)卡）簡(jiǎn)析
非常不錯(cuò)的三種簡(jiǎn)潔的Tab導(dǎo)航（網(wǎng)頁(yè)選項(xiàng)卡）簡(jiǎn)析...2007-08-08
javascript特效實(shí)現(xiàn)——當(dāng)前時(shí)間和倒計(jì)時(shí)效果的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇javascript特效實(shí)現(xiàn)——當(dāng)前時(shí)間和倒計(jì)時(shí)效果的簡(jiǎn)單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-07-07