组件样式
直接写在 jsx
中
import React, {Component} from 'react';
class App extends Component {
render() {
const obj = {
width: '100px',
height: '100px',
backgroundColor: 'red'
}
return (
<div>
<div style={obj}>12</div>
<div style={{fontSize: '20px'}}>abc</div>
</div>
);
}
}
export default App;
导入外部 css
app.jsx
: 定义类名的时候, 要使用className
来定义
import React, {Component} from 'react';
import '../css/app.css'
class App extends Component {
render() {
return (
<div>
<div className='box'>12</div>
</div>
);
}
}
export default App;
app.css
.box {
font-size: '30px';
color: 'red';
}