1.  我想大家做iOS移動端開發(fā)去做微信小程序感覺挺新奇的本人是這個想法，愿意嘗試。這段時間不是很忙公司留給時間學習微信小程序開發(fā)。我也就小結一下。我依舊是菜鳥無法與大神相提并論，大神的話不許要看下面可以直接走開。入門前還是要對小程序有所了解。微信小程序簡單，快捷，用后即關。我這種用戶就是這樣，需要了看下，不需要百年都不會打開看一眼。

2.  準備工作：

1> 看官方文檔，全都看完了解一下。我是這么搞的。

2> 不建議直接開發(fā)，你畢竟是iOS開發(fā)工程師。你甚至不懂html就不要搞wxml。js、css、及json文件都是搞啥的。開發(fā)前要明白這些。本人是知道后直接上手的。

3> 不需要急因為沒用，就如讓你搞個即時通信自做（Websocket）你都不知道是啥搞個毛，不推薦直接上手，我無法堅持，毛都不會如何上手，這看一點那看一點。最后還是亂套迷糊。走過的坑高速自己還是一步步來。很快就可以搞得定。搞程序切記眼高手低。本人還是回歸根本。我是一只小小鳥，只想跟隨大神們的腳步，一步步走。

4> 如果你公司有個做前端的，那么恭喜你。你可以減少一半的學習時間。我是比較幸運的。微信小程序開發(fā)工具確實不是很友善各種字符硬敲，各種標簽，我一搞iOS開發(fā)的看見就煩，但還是要靜下心。畢竟出來沒多長時間，相信一定會越來越好。

5> 本人是從布局開始搞起的因為掉過很多坑了。統(tǒng)一學習的。慢慢總結，還是要靠一些記憶力的。對于方法封裝及傳數據，及等等吧，也大差不差。不過不要再以iOS的寫法標準考慮小程序。完全不一個東西。

3. css小結一下：

display:flex; 這是什么鬼東西呢，

1. flex布局為默認橫向排列元素

2. flex-direction 決定元素排列方向

3. flex-wrap 決定元素如何換行（數據多的時候）

nowrap 默認值。規(guī)定靈活的項目不拆行或不拆列。

wrap  規(guī)定靈活的項目在必要的時候拆行或拆列。

wrap-reverse  規(guī)定靈活的項目在必要的時候拆行或拆列，但是以相反的順序。

initial 設置該屬性為它的默認值。請參閱 initial。

inherit 從父元素繼承該屬性。請參閱 inherit。

4.flex-flow

flex-flow: wrap row，編譯運行結果：如圖5所示，flex-flow相當于 flex-direction和 flex-wrap兩個屬性的組合

5. justify-content:center

:space-between每個子view左右都有留邊，但是首尾兩個view各自左右對齊不留邊

:space-around---效果如圖8所示，每個子view左右都有留邊

6.position: relative;  // 相對定位 position: absolute;      // 絕對定位

。。。。。。。。

下面你看到就熟悉了哦。開心一下。

1. 尺寸

width: 228rpx;  // 寬度

height: 228rpx; //  高度

min-width:    //最小寬度

max-width:    //最大寬度

min-height:  //最小高度

max-height:  //最大高度

...

2. 背景

background-color: darkcyan;  //背景顏色

...

3. 邊框

border-radius: 20%;    //邊框圓角

border-width: 5px;      //邊框寬度

border-color: #ddd;    //邊框顏色

border-style: solid;    //邊框樣式

...

4. 邊距

margin: 20rpx;      //外邊距，邊框距離父級元素的距離

margin: 14rpx 50rpx 30rpx 50rpx;    // 上右下左   1px =2rpx

padding: 20rpx;    //內邊距，邊框距離元素的距離

padding: 10rpx 20rpx 30rpx 40rpx;    // 上右下左

5. 文本

font-size: 30px;    //字體大小

 

這只是其中一點點哦可見路還很遙遠對吧。沒錯，不過相信自己一定可以的。本人以前考空余時間搞過java語法，考這個自己還做了一個小賣鋪的系統(tǒng)。哈哈