react如何写css?=>styled-components

image.png

在react里面,有两个通用的概念:

  • 一切皆是组件
  • all in js

css的样式布局,也从sass loader切换到js文件
使用styled-components

https://www.styled-components.com/

2种安装方式

  • yarn add styled-components
  • npm install --save styled-components
    如过npm网络不好,建议使用cnpm

案例

将css文件改为js

import styled from 'styled-components';

export const HeaderWrapper = styled.div`
/* 使用flex布局 */
display:flex;
flex-direction:row;
height:56px;
width:100%; 
border-bottom: 1px solid #f0f0f0;
`;
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容