一 第一种内联样式

<View style={{ width:100}}></View>

二 第二种传对象

let  style1={width:100}

<View style={style1}></View>

三 样式拼接

也就是数组里面放对象

<View style={[{backgroundColor:'red'},{width:200}]}></View>

四 StyleSheet创建样式

const styles = StyleSheet.create({

container: {backgroundColor: 'red',width:SCREEN_WIDTH,height:SCREEN_HEIGHT},

welcome: {fontSize: 20,textAlign: 'center',margin: 10,},

instructions: {textAlign: 'center',color: '#333333',marginBottom: 5,},});

<View style={styles.container}></View>

五 样式分离

1.新建一个wlb_style.js,将样式属性写到里面

import React, {StyleSheet} from "react-native";

const wlb_style=StyleSheet.create({

s1:{backgroundColor:'yellow'}

})

export default wlb_style

2.在文件中倒入：

<View style={wlb_style.s1}></View>