ReactJS Beta文档组件为何用css属性而非style设置样式？

这个不是React原生的新特性，是**CSS-in-JS库（比如Emotion）**提供的扩展功能，React文档官网正是用Emotion来实现样式管理的。

相比原生style属性，使用css prop有这些核心优势：

• 原生style仅支持行内基础样式，无法使用伪类、伪元素、媒体查询、CSS动画等高级CSS特性；而css prop支持编写完整的CSS语法，能实现所有常规CSS的效果。
• css prop可以结合JS变量实现动态样式，还自带样式隔离机制，避免大型项目中常见的类名冲突问题。
• 对于复杂组件的样式，css prop的代码结构更清晰，更易于维护和复用。

要使用这个css prop，项目需要先集成对应的CSS-in-JS库，并配置Babel或SWC等编译工具，让它们能识别并转换这个自定义属性为浏览器可解析的样式代码。

内容的提问来源于stack exchange，提问作者tanjona Randrianasolo