手册
目录
收藏753
分享
阅读2248
更新时间2025-08-20
Sass 是一个 CSS 预处理器。
Sass 文件在服务器上执行并将 CSS 发送到浏览器。
您可以在我们的 Sass 教程中了解有关 Sass 的更多信息。
如果您在项目中使用 create-react-app,您可以轻松地在 React 项目中安装和使用 Sass。
通过在终端中运行此命令来安装 Sass:
>npm i sass
现在您可以在项目中包含 Sass 文件了!
创建 Sass 文件的方式与创建 CSS 文件相同,但 Sass 文件的文件扩展名为 .scss
在 Sass 文件中,您可以使用变量和其他 Sass 函数:
创建一个变量来定义文本的颜色:
$myColor: red;
h1 {
color: $myColor;
}
以与导入 CSS 文件相同的方式导入 Sass 文件:
import React from 'react';
import ReactDOM from 'react-dom/client';
import './my-sass.scss';
const Header = () => {
return (
<>
Hello Style!
Add a little style!.
>
);
}
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render( );
运行实例 »
相关
视频
RELATED VIDEOS
科技资讯
1
2
3
4
5
6
7
8
9
精选课程
共5课时
17.2万人学习
共49课时
77.1万人学习
共29课时
61.8万人学习
共25课时
39.4万人学习
共43课时
71万人学习
共25课时
61.7万人学习
共22课时
23万人学习
共28课时
34万人学习
共89课时
125.3万人学习