React 嵌套类名样式不生效

// app/blog/page.js
import styles from "./page.module.scss"

export default function Blog () {
    return (
        <div className={styles.blog}>
            <div className='circle'>
                <div />
            </div>
        </div>
    )
}

/* app/blog/page.module.scss */
.blog {
  color: red;

  .circle {
    display: inline-block;
    transform: translateZ(1px);
    box-sizing: border-box;
    color: #1c4c5b;

    & > div {
      display: inline-block;
      width: 64px;
      height: 64px;
      margin: 8px;
      background: currentColor;
      border-radius: 50%;
      box-sizing: border-box;
    }
  }
}

// app/blog/page.js
import styles from "./page.module.scss"

export default function Blog () {
    return (
        <div className={styles.blog}>
            <div className={styles.circle}>
                <div />
            </div>
        </div>
    )
}

相关文章：

Docker部署Kafka SASL_SSL认证，并集成到Spring Boot

一种时间戳对齐的方法（离线）

C++（Day35）

Android音视频直播低延迟探究之：WLAN低延迟模式

计算机毕业设计Python+大模型中医养生问答系统 知识图谱 医疗大数据 中医可视化 机器学习 深度学习 人工智能 大数据毕业设计

Redisson的可重入锁

CSS 布局技巧实现元素左右排列

使用 Vue 的事件总线：为了实现点击当前按钮关注或取消关注时，另一个页面的 Vue 组件中的表格数据自动刷新

PowerShell 脚本自动化 Windows 工作开发流程

论文《Graph Neural Networks with convolutional ARMA filters》笔记

开关电源的占空比与输入输出电压的关系

更改PaddlePaddle的模型默认缓存目录

Anaconda下载及安装保姆级教程（详细图文）

基于Java+SpringBoot+Vue+MySQL的西安旅游管理系统网站

办海洋测绘乙级该如何准备才能万无一失办下来

2.3.1 协程设计原理与汇编实现coroutine 2

路径规划 | 基于A*算法的往返式全覆盖路径规划的改进算法（Matlab）

【西电电装实习】6. 手装无人机的蓝牙断连debug

【linux006】目录操作命令篇 - pwd 命令

vue3 自定义指令 directive

CSS-3

如何让大模型更好地进行场景落地？

OpenSSL工具验证RSA证书

C# 批量更改文件后缀名称

软件测试中常用模型分析

【编程底层思考】性能监控和优化：JVM参数调优，诊断工具的使用等。JVM 调优和线上问题排查实战经验总结