时间戳

首页 > 解决方案 > 样式在样式表中不起作用

reactjs - 样式在样式表中不起作用

问题描述

我通过样式表在 React 项目中使用 sass 但不工作 我的应用类不工作

这是代码sass代码

.header{
background-color: #000;
position: relative;
width: 100%;
top:0;
left: 0;
z-index: 100;

}

这是反应代码。

        import React from "react"
    import  "../Styles/Header.module.scss"
   const Header = () => {
    return (
    <>
      <header className="header">
        <div className="grid">
          <div className="main_logo">
            <a>ds</a>
          </div>
          <div className="navigation_btn">
            <samp></samp>
          </div>
        </div>
      </header>
    </>
  );
};

export default Header;

我在浏览器中看到它，但没有显示背景颜色。

它与纯 HTML select 一起使用。我在不使用类的情况下应用样式是工作。

标签： reactjssass

解决方案

您正在使用 .module scss。所以首先你必须将你的导入转换为

import classes "../Styles/Header.module.scss"

其次，您将调用您的标签：

<header className={classes.header}>

推荐阅读