React中行内样式的写法：
在jsx中，如果想写行内样式了，不能为 style设置字符串的值 而是应该这么写：
<div style = { {color :‘red’，boxShadow:'0 0 10px #ccc',fontSize:'14px' } }></div>在行内样式中， 如果是数值类型的样式，则可以不用引号包裹，如果是 字符串类型的样式值，必须使用引号包裹.。
React中用类名className的方式书写 :
用类名的方式，不在用class因为是关键字；要使用className 直接导入css样式表，默认是在全局上，整个项目都生效的 疑问：React中，有没有类似于scoped这样的指令呢？ 答案： 没有；因为在 React中，根本就没有指令的概念
【【React中如何才能像vue （scoped）那种有自己的样式模块化呢？
1：打开webpack 在css-loader后加上?modules 代表启用模块化
{test:/\.css$/,use:['style-loader','css-loader?modules']}, //打包处理 css样式表的第三方loader大家可以在css-loader之后，通过？ 追加参数 ， 其中，有个固定的参数，叫做modules，表示为普通的css样式，启用模块化。
2：创建css文件，并导入需要用到样式的文件中 a.css
.title { color:red; text-align: center; font-weight: 200; }a.jsx 导入css文件
import classObj from '@/css/Movie.css' **启用模块化之后就可以导入一个对象， 用这个对象去点我们的类名** console.log(classObj); //打印出来的是一个对象 打印结果： title: "_1p3ibrao79RsB5kh0by7YB"3：页面上进行调用类名
<h1 className = {classObj.title} >这是评论列表组件</h1>注意：css模块化，只针对 类选择器 和 ID选择器生效，不会将标签选择器模块化
:global（）和 :local ( )
:global(.test){ // 被:global（）包裹起来的类名，不会被模块化，而是会全局生效 font-style : italic } 被:local()包裹起来的类名和id选择器会被模块化 【不常用】
在项目中启用模块化并同时使用 bootstrap
在React中 我们引用第三方库（比如bootstrap）我们直接用它的类名就会报错，因为我们给css启用了模块化，用类名的话只能通过对象点出来的形式
例如这串代码
<button className = { [bootcss.btn , bootcss['btn-primary']].join(' ')}>按钮</button>这种太麻烦了！！！ 想直接用 <button className = “btn btn-primary”></button>这种形式 所以，可以自己规定： 第三方样式表，都是以 .css结尾， 这样我们就不用为普通的css启用模块化了 自己的样式表：要以.scss或less结尾，只为，sass和less做模块化。
1: 把自己的css样式表，定义为.scss文件 2： 第三方的(bootstrap)样式表，还是以.css结尾 3： 我们只需要为自己的.scss文件，启用模块化即可。 4： 运行cnpm i sass-loader node-sass - D 安装能够解析scss文件的loader
module: { // 所有第三方 模块的配置规则 rules: [ // 第三方匹配规则 { test: /\.js|jsx$/, use: 'babel-loader', exclude: /node_modules/ }, // 千万别忘记添加 exclude 排除项 {test:/\.css$/,use:['style-loader','css-loader']}, //打包处理 css样式表的第三方loader {test:/\.ttf|woff|woff2|eot|svg$/ , use:'url-loader'}, **{test:/\.scss$/,use:['style-loader','css-loader?modules&localIndentName=[path][name]-[local]-[hash:5]','sass-loader']}** //打包处理scss文件的loader ] },配完之后页面上直接可以用 css不在启用模块化了，bootcss这个对象此时就是个空的{} 所以直接导入我们的bootstrap的css样式
