微信小程式-02(元件應用主要是style應用)
目錄
邊學邊更新了
居中
<view class='labelStyle'><label>使用者登陸</label></view>
.labelStyle{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
/* 垂直也居中 */
/* position: absolute */
}
效果
不換行
<view style="display:flex; margin-top:30%"> <label> 賬戶:</label> <view class="weui-cells weui-cells_after-title"> <input type='text' auto-focus class="weui-input"></input> </view> </view>
效果
相關推薦
微信小程式-02(元件應用主要是style應用)
目錄 居中 不換行 邊學邊更新了 居中 <view class='labelStyle'><label>使用者登陸</label></view> .labelStyle{ display: flex;
微信小程式自定義元件實現地址單級連續選擇(拼多多APP地址選擇樣式)
最終效果在 首先在page資料夾下建立components資料夾,在components資料夾下建立region-picker的資料夾,然後在region-picker資料夾下建立Component名稱為region-picker。 region-picke
微信小程式把玩(二十三)modal元件
modal彈出框常用在提示一些資訊比如:退出應用,清楚快取,修改資料提交時一些提示等等。 常用屬性: wxml <!--監聽button點選事件--> <button b
微信小程式把玩(二十七)audio元件
音訊播放已經封裝的很好!只需配合屬性設定即可! (method和data配合使用) 主要屬性: wxml <audio action="{{action}}"
(三)微信小程式之容器元件view實現水平和縱向佈局
專案中最常用的兩種佈局方式,水平佈局和垂直佈局,在微信小程式中實現起來也比較簡單。 1.橫向水平佈局: 實現水平佈局,需要四個view容器元件,其中一個是父容器。如下: <!--index.wxml--> <view class="content"&g
微信小程式把玩(九)scroll-view元件
scroll-view為滾動檢視,分為水平滾動和垂直滾動。注意滾動檢視垂直滾動時一定要設定高度否則的話scroll-view不會生效。滾動檢視常用的地方一般都是Item項比較多的介面,比如我的模組
微信小程式自定義元件TabLayout(類似於今日頭條的滑動選單)
有了安卓開發經驗,自定義微信小程式元件簡直易如反掌。 自定義微信小程式的步驟如下: 建立四個檔案 分別是邏輯控制js,配置檔案json,佈局檔案wxml,樣式檔案wxss。 配置檔案.json的編寫 component引數:說明這個資料
微信小程式把玩(二十八)image元件
image元件也是一個程式不可缺少的,可以這樣說一個app中image元件隨處可以看到,一般 image有兩種載入方式第一種是網路圖片第二種是本地圖片資源,都用src屬性去指定。 重點屬性:
微信小程式把玩(十四)button元件
button按鈕用的算是最普遍的元件之一。 主要屬性: wxml <!--按鈕預設樣式,點選事件--> <button type="defaule" bindtap="c
微信小程式----scroll-view元件(MUI索引列表)滾動動畫
效果圖 實現原理 利用scroll-view的scroll-into-view屬性進行定位; 利用scroll-view的scroll-with-animation屬性實現滾動動畫
微信小程式把玩(二十五)loading元件
loading通常使用在請求網路資料時的一種方式,通過hidden屬性設定顯示與否 主要屬性: wxml <!----> <button type="primary"
微信小程式把玩(十五)checkbox元件
不得不吐糟下checkbox預設樣式真是有點略醜!!!checkbox元件為一個多選框被放到checkbox-group組中,並在checkbox-group(只能包含checkbox)中設定監聽事
微信小程式把玩(十二)text元件
通常文字設定要不在wxml中設定,再要不就是通過weml繫結在js中設定文字。 wxml <view > <text>我是文字元件</text>
【微信小程式】媒體元件(一)audio
週四沒有課,寫個部落格慶祝一下今天記錄一下audio的基本使用,首先看下效果圖。(聲音請腦補一下~)1.介紹一下audio屬性(來自微信官方文件)屬性名型別預設值說明idStringaudio 元件的唯一識別符號srcString要播放音訊的資源地址loopBooleanfa
微信小程式把玩(十三)progress元件
進度條描述的是一種載入的狀態,比如軟體升級下載進度, 視訊,圖片下載進度… 主要屬性: wxml <progress percent="80" show-inf
微信小程式把玩(二十九)video元件
視訊播放元件與圖片載入元件也沒啥差別,使用起來也沒啥注意的 重要屬性: wxml <!--監聽button點選事件--> <button bindtap="liste
微信小程式把玩(十九)radio元件
radio元件為單選元件與radio-group組合使用,使用方式和checkbox沒啥區別 主要屬性: wxml <!--設定監聽器,當點選radio時呼叫--> &
微信小程式web-view元件
小程式web-view元件 不久前微信小程式釋出了web-view元件,這個訊息在各個圈裡引起不小的漣漪。近期正好在做小程式的專案,便研究了一下這個讓大家充滿期待的元件。 1,web-view這個元件是什麼鬼? 官網的介紹:web-view 元件是一個
微信小程式畫布Canvas元件touchend事件不觸發處理
一、摘要 在微信小程式手勢圖案鎖屏、解鎖實現並提供onSuccess等回撥一文中,用Canvas畫布元件實現了類似Android和Iphone的圖案鎖屏、解鎖功能,除去偶爾卡頓、滑動不連續外,其它都還不錯。但是最近發現一個很嚴重的問題,當觸控很快劃離畫布的時候,Canvas元件沒有觸發t
微信小程式:map元件
其實前些天,吳哥就說讓我加上一個定位,我說我還沒看文件,還沒學,暫時沒加。今天上午終於開始接受map元件的挑戰,我不滴不說我真的是很懶,好吧,也有點會拒絕困難,但如果真的需要,我也可以去學習去解決,大概我的身邊缺少一個讓我有動力的吧,別問我