React - 组件的样式处理

suaxi
2026-02-01 / 0 评论 / 2 阅读 / 正在检测是否收录...

1. 内联样式(不推荐)

<div style={{ color='red' }}>测试</div>


2. class 类名控制

.App {
    color: red
}
import './index.css'

function App() {
  return (
    <div className="App">测试</div>
  )
}

export default App


3. 示例

.test {
    color: plum;
}
import './index.css'

const style = {
  color: 'lightBlue',
  fontSize: 20
}

function App() {
  return (
    <div className="App">
      <div style={style}>行内样式</div>
      <div className="test">行内样式</div>
    </div>
  )
}

export default App

1.示例.png

0

评论 (0)

取消