微信公眾號開發教程[016]-網頁開發-樣式庫
阿新 • • 發佈:2019-01-02
我承接app和微信公眾號開發,如果有誰需要的話,可以惠顧我,謝謝.
QQ: 40678884
微信: szuzsq
-------------------------------------------------------------------------------------------------------------------------------------
這個比較簡單,就是微信自己弄的一套css,風格和微信自己的相似.使用很簡單.1).從https://nodejs.org/en/上下載node-v4.4.7-x86.msi,安裝然後,開啟"Node.js command prompt",在它的命令列下輸入:npm install --save weui
2).然後會下載weui,只需要在頁面中引入 dist/style/weui.css或者dist/style/weui.min.css其中之一即可.例如:
<link rel="stylesheet" href="weui/dist/style/weui.min.css"/>
3).然後就可以使用它的class製作各種按鈕啊,進度條啊什麼的啊.例如,官方的例子:
<a href="#" class="weui_btn weui_btn_primary">按鈕</a> <a href="#" class="weui_btn weui_btn_disabled weui_btn_primary">按鈕</a> <a href="#" class="weui_btn weui_btn_warn">確認</a> <a href="#" class="weui_btn weui_btn_disabled weui_btn_warn">確認</a> <a href="#" class="weui_btn weui_btn_default">按鈕</a> <a href="#" class="weui_btn weui_btn_disabled weui_btn_default">按鈕</a> <div class="button_sp_area"> <a href="#" class="weui_btn weui_btn_plain_default">按鈕</a> <a href="#" class="weui_btn weui_btn_plain_primary">按鈕</a> <a href="#" class="weui_btn weui_btn_mini weui_btn_primary">按鈕</a> <a href="#" class="weui_btn weui_btn_mini weui_btn_default">按鈕</a> </div>
效果如下:
其他的,可以參見官方文件.並且從npm下載下來的,還有比較全的demo.