【前端学习——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
相关推荐
二哈喇子!16 分钟前
前端HTML、CSS、JS、VUE 汇总
开发语言·前端
小白路过16 分钟前
node-sass和sass兼容性使用
前端·rust·sass
IT_陈寒16 分钟前
Python 3.12 新特性实战:这5个改进让我的开发效率提升40%
前端·人工智能·后端
两个西柚呀19 分钟前
每日前端面试题-防抖和节流
前端
阿眠26 分钟前
前端面试题
前端
清风徐来QCQ36 分钟前
SpringMvC
前端·javascript·vue.js
im_AMBER36 分钟前
Leetcode 99 删除排序链表中的重复元素 | 合并两个链表
数据结构·笔记·学习·算法·leetcode·链表
Smoothzjc37 分钟前
👉 求你了,别再裸写 fetch 做 AI 流式响应了!90% 的人都在踩这个坑
前端·人工智能·后端
沛沛老爹37 分钟前
Web开发者进阶AI:Agent技能设计模式之迭代分析与上下文聚合实战
前端·人工智能·设计模式
YangYang9YangYan41 分钟前
中专大数据技术专业学习数据分析的价值分析
大数据·学习·数据分析