RN CSS

RN中基本都使用flexbox进行布局，但语法和常规的CSS不同：

• 属性名都使用驼峰结构，而不是中划线，如：alignItems，不能写align-items
• RN中display默认是 flex,另一个值是：‘none’
• RN中flexDirection默认是 column
• 属性取值基本就两种：数值和字符串，数值类如width的写法是width:200，不能带单位‘px’,与之类似的还有height,marginTop,left等在常规CSS中需要带px的属性；对于不带px的都要写成字符串的形式，例如position:"absolute"
• 属性的写法：可带双引号，也可不带。如position:"absolute"或者"position":"absolute"
• RN中CSS规则之间用逗号","分隔，常规CSS中用分号";"
• 阴影的实现：RN端不支持box-shadow，用四个类似的属性代替ios，Android上用elevation,elevation不能设置阴影颜色，统一灰色

    shadowOffset: { width: 0, height: 5 },
    shadowRadius: 3,
    shadowColor: '#41464b',
    shadowOpacity: 0.1,
    elevation: 4

• RN中 postion只有‘relative’ 和 ‘absolute’ ；默认为‘relative’。在Android中如果子元素使用absolute，且其宽高超过父元素，会被父元素的边界所截断

• RN 中所有基本组件默认宽度都是100%，如Text,View,TextInput。当其参与flex布局时，Text，TextInput宽度会变为自身内容宽度
• View 与div类似，但View不能单独使用，必须包含其他组件
• box-sizing 默认值：'border-box'
• 所有默认值如下：

box-sizing: border-box;
position: relative;
display: flex;
flex-direction: column;
align-items: stretch;
flex-shrink: 0;
border: 0 solid black;
margin: 0;
padding: 0

• 样式操作
  https://hackernoon.com/advanced-react-native-styling-with-a-few-lines-of-code-4b6a94385015