CSSModule

模块方式引入 让其有scope属性，命名方式必须是xxx.moudle.css

src/css/Film.module.css

.kerwinactive{
  border-bottom: 1px solid red;
  color:blue;
}
:global(#kerwin){ //深度
  background:red;
}
.film ul li{
  list-style: none;
}

组件使用

import style from './css/Film.module.css'

export default class Films extends Component {
  render() {
    return (
      <div className={style.film+" aaaa"}> //多个样式
        <div style={{height:"200px",background:"yellow"}}>大轮播</div>
        <ul>
          <li>
            <NavLink to="/films/nowplaying" activeClassName={style.kerwinactive}>正在热映</NavLink>
          </li>
          <li>
            <NavLink to="/films/comingsoon" activeClassName={style.kerwinactive}>即将上映</NavLink>
          </li>
        </ul>
      </div>
    )
  }
}