一、元素设置style属性

<View style={{backgroundColor:"#FDF6E3",flex:1}} ></View>

1.1 常见样式

  container:{
    backgroundColor:"#FDF6E3",
    flex:1,
    // marginTop:100,
    margin:50,
    borderWidth:1,
    borderColor:"#FA5068",
    borderRadius:16,

    shadowOffset:{
      height:3,
      width:3
    },
    shadowColor:"#323837",
    shadowRadius:16,
    shadowOpacity:1,
  }

1.2 文字样式

  title:{
    fontSize: 26,
    color: "green",
    fontStyle:"italic", //斜体
    fontWeight:"900", //最粗，或者使用 "bold"
    // fontFamily: //字体
    letterSpacing:4,
    lineHeight: 33,
    
    textAlign: 'center',

    textDecorationLine:'underline', // underline,line-through
    textDecorationStyle:'dotted'
  }

文字样式

二、创建style object: StyleSheet.create(obj)

class MovieTalk extends Component{
  render(){
    return (
      <View style={styles.container} ></View>
    )
  }
}

let styles=StyleSheet.create({
  container:{
    backgroundColor:"#FDF6E3",
    flex:1
  }
})

三、区别

主要是性能问题，参考stackoverflow

• Making a stylesheet from a style object makes it possible to refer to it by ID instead of creating a new style object every time.
• It also allows to send the style only once through the bridge. All subsequent uses are going to refer an id (not implemented yet).