一、行内样式
如果你的行内样式没有生效，看一下是不是写少了一个花括号
export default class MyStyle extends Component {
render() {
return (
<div>
<div style={
{ margin: "auto",background:'#cfc' }}>
<h1>我是一个h1标签,红色的</h1>
<h2>我是一个h2标签,蓝色的</h2>
</div>
</div>
);
}
}注意点：值得注意的是，style的后面我们写了两对大括号。最外面的一对是指我们要在html里面开启js执行环境，里面的一对是我们写的对象语法的括号。
二、外链样式
其中外链样式最简单，只需要在组件里面引入对应的外部样式就行。
MyStyle.css文件
h1{
color: red;
}
.title{
background-color: #fcf;
}MyStyle.jsx文件
import React, { Component } from "react";
//外链样式引入
import "./MyStyle.css";
export default class MyStyle extends Component {
render() {
return <h1 className="title">我是一个h1标签,红色的</h1>
}
}