Weex記錄

1.px機關

Weex 對于長度值目前隻支援px和wx（不受螢幕寬度和viewPortWidth影響），不支援相對機關（em、rem）。
           

2.盒模型

Weex 盒模型的 box-sizing 預設為 border-box，即盒子的寬高包含内容、内邊距和邊框的寬度，不包含外邊距的寬度
*注：在 Android 平台，Weex 隻支援 overflow:hidden（overflow: hidden 在 Android 上是預設行為，但隻有下列條件都滿足時，一個父 view 才會去剪切它的子 view。
(1).父view是 div, a, cell, refresh 或 loading。
(2).系統版本是 Android 4.3 或更高。
(3).系統版本不是 Andorid 7.0。
(4).父 view 沒有 background-image 屬性或系統版本是 Android 5.0 或更高。
是以在寫樣式的時候應當注意定寬的容器是否相容android）。
在 iOS 上，Weex 支援 overflow:hidden 和 overflow:visible，預設是 overflow:visible。
           

3.Flexbox

在 Weex 中，Flexbox 是預設且唯一的布局模型，是以你不需要手動為元素添加 display: flex; 屬性
flex-direction定義了 flex 容器中 flex 成員項的排列方向，預設值為 column
lex
flex 屬性定義了 flex 成員項可以占用容器中剩餘空間的大小。如果所有的成員項設定相同的值 flex: 1，它們将平均配置設定剩餘空間。如果一個成員項設定的值為 flex: 2，其它的成員項設定的值為 flex: 1，那麼這個成員項所占用的剩餘空間是其它成員項的 2 倍。Flex 成員項暫不支援 flex-shrink 和 flex-basis 屬性。

flex {number}：值為 number 類型。該屬性不支援 flex: <flex-grow> | <flex-shrink> | <'flex-basis> 的簡寫。
           

4.box-shadow

Weex 支援 box-shadow 屬性用于設定元素陰影。

*注：目前僅 iOS 支援 box-shadow 屬性，Android 暫不支援，可以使用圖檔代替。
每個元素隻支援設定一個陰影效果，不支援多個陰影同時作用于一個元素。
           

5.font-weight {string}：字型粗細程度

可選值: normal, bold, 100, 200, 300, 400, 500, 600, 700, 800, 900，normal 等同于 400, bold 等同于 700；預設值: normal；

*注：iOS 支援 9 種 font-weight值；
    Android 僅支援 400 和 700, 其他值會設為 400 或 700
    類似 lighter, bolder 這樣的值暫時不支援
           

6.text-decoration：字型裝飾

可選值 none | underline | line-through，預設值為 none。

*注: 文本樣式隻支援 <text> 和 <ricthext>
           

7.click事件

<input> 和 <switch> 元件目前不支援 click 事件，請使用 change 或 input 事件來代替。
           

8.事件冒泡

Weex 在 0.13 版本 SDK 裡實作了事件冒泡機制。注意事件冒泡預設是不開啟的，你需要在模闆根元素上加上屬性 bubble=true 才能開啟冒泡
事件冒泡預設不開啟，需要手動添加 bubble=true 屬性到根元素上
<template>
  <!-- 開啟事件冒泡機制. -->
  <div bubble="true">
    ...
  </div>
</template>
           

持續更新中…