一 第一种内联样式
<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>