react如何添加css样式-创新互联
小编给大家分享一下react如何添加css样式，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
为民丰等地区用户提供了全套网页设计制作服务，及民丰网站建设行业解决方案。主营业务为成都网站设计、成都网站建设、民丰网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！
添加方法：1、使用“style={{样式代码}}”在组件内部定义css样式；2、先创建style样式对象，然后在render函数的组件中使用“style={{对象}”语句引用；3、使用“import 'css文件路径'”引入外部css文件。
相对于html中引用css的三种方法，react中也有三种方法，一一相对：
1、行内样式：直接在组件内部定义
行内样式是一种最基本的写法，也就是我们最开始学HTML时写的内联样式那样，在项目中可能会比较少用到
在JSX中的用法：
class App extends React.Component {
// ...
render() {
return (
Second Way!
)
}
}
需要注意的是，这里的css样式名采用驼峰命名法：如font-size →fontSize，并且你需要将CSS属性放在双大括号之间。为什么要用两个大括号？因为在JSX中渲染的JS表达式，它们必须被放在一对大括号里，{style}可以视为一个JS对象。所以第一对大括号正是将JS表达式放入JSX解析，里面的那对大括号则创建了一个style对象实例，所以在这里style是作为一个对象传入组件
2、声明样式：
声明样式其实是行内样式的一种改进写法，在render函数外部创建style对象，然后传递给组件，让css与标签分离，但实际上样式多了的话还是不太美观
class App extends React.Component {
//...
const style1={
background:'#eee',
width:'200px',
height:'200px'
}
const style2={
color:'red',
fontSize:'40px'
}
render() {
return (
Second Way!
