在 jsx 模块中导入的 React CSS 未应用
P粉063862561
P粉063862561 2024-04-03 18:41:07
0
1
503

我导入我的 css 文件,如下所示:

import styles from "./Documentation.module.css";

使用此处的样式:

<button
    className={styles.button}
    onClick={(e) => selectDoc(m.id)}
    >
    <b>{m.title}</b>
</button>

按钮的 CSS 如下所示:

.button {
    color: "#d0e6a5";
    background-color: "#5d684b";
    border: "none";
    border-left: "4px solid #d0e6a5";
    font-size: "28px";
    padding: "6px 12px";
    margin: "3px";
    width: "200px";
}

但是 css 不会应用于按钮元素。所有风格都会发生这种情况。我不知道问题是什么。

在这里,使用内联或“样式”对我来说是没有选择的,因为 css 会变得更多。 知道如何诊断这里的问题吗?

P粉063862561
P粉063862561

全部回复(1)
P粉648469285

该错误存在于 css 文件中,语法不正确。您不必在他的值中加上引号。尝试用下面的css替换它

.button {
color: #d0e6a5;
background-color: #5d684b;
border: none;
border-left: 4px solid #d0e6a5;
font-size: 28px;
padding: 6px 12px;
margin: 3px;
width: 200px;}
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板