首页 > 解决方案 > CSS文件不起作用

问题描述

我已经用css文件在这个应用程序上工作了一段时间,最新的一个无缘无故根本不起作用,文件被导入,id是正确的,它在同一个目录中并且它不起作用。

这是组件的代码

import React from "react";
import "./allShows.css"

export default class allShows extends React.Component{

    constructor() {
        super();
    }


    render() {
        return(
            <React.Fragment>
                <div id="2header">
                    dw
                </div>
            </React.Fragment>
        )
    }
}

和CSS

#2header{
    height: 100px;
    background-color: #555353;

}

有任何想法吗?

标签: javascripthtmlcss

解决方案


从 id 中删除数字。

css 中的选择器不能以数字开头。您可以更改 css 文件中的数字或转义数字。

您可以使用 \3 或 \00003 转义数字

对于 id='2header' 你可以试试:

#\32 header {
  /* styles here */
}

阅读:https ://medium.com/front-end-weekly/css-selector-for-element-which-have-numbers-as-class-name-b6a089989199


推荐阅读