【前端学习——css模块化】

https://segmentfault.com/a/1190000039772466#item-2


CSS 命名方法论

为选择器增加冗长的前缀或后缀,手写命名前缀后缀的方式 来生成全局唯一的命名

很麻烦不方便

CSS Modules

在外部管理 CSS,然后将类名映射到组件内部,他会为每个 class 都分配一个全局唯一 hash。

在 React 中编写 CSS

  • 使用 styled-components
javascript 复制代码
// styles.js
import styled, { css } from 'styled-components'

// 创建一个名为 Wrapper 的样式组件 (一个 section 标签, 并带有一些样式)
export const Wrapper = styled.section`
  padding: 10px;
  background: deepskyblue;
`
  • 使用 CSS Modules
相关推荐
moxiaoran575317 分钟前
uni-app学习笔记三十--request网络请求传参
笔记·学习·uni-app
Angel_girl31932 分钟前
vue项目使用svg图标
前端·vue.js
嘉陵妹妹33 分钟前
深度优先算法学习
学习·算法·深度优先
難釋懷37 分钟前
vue 项目中常用的 2 个 Ajax 库
前端·vue.js·ajax
Qian Xiaoo39 分钟前
Ajax入门
前端·ajax·okhttp
爱生活的苏苏1 小时前
vue生成二维码图片+文字说明
前端·vue.js
拉不动的猪1 小时前
安卓和ios小程序开发中的兼容性问题举例
前端·javascript·面试
炫彩@之星1 小时前
Chrome书签的导出与导入:步骤图
前端·chrome
乖乖是干饭王1 小时前
Linux系统编程中的_GNU_SOURCE宏
linux·运维·c语言·学习·gnu
贩卖纯净水.1 小时前
浏览器兼容-polyfill-本地服务-优化
开发语言·前端·javascript