外部 CSS 未在反应中应用

Question

我正在为反应代码使用外部样式表。它不工作。我的 VS 反应代码中有五个文件。 index.html, index.js, AppC.js, AppC.css, UserC.js 除了 index.html 所有其他文件都在 src 中。我没有收到任何错误，只有 css 没有被应用。（我没有更改 index.html）（可以将 App.js 文件名更改为 AppC.js 或其他内容吗？我知道我们不能更改索引。 html 和 index.js)

**index.js**

import AppC from './AppC'
import UsersC from './UsersC'
ReactDOM.render(<AppC />,document.getElementById('root')); 

**AppC.js**

import React, { Component } from 'react';
import './AppC.css';
import UsersC from './UsersC';


export default class AppC extends Component {
    render(){
        let style = true;
        return (
            <React.Fragment>
                <h2 className= 'texg'> Hello Css </h2>
                <UsersC rang={style ? 'textg' : 'textb' } />
            </React.Fragment>      
              );
    }
}

**AppC.css**


.txtg{
    color:green;
}
.txtb{
    color:blue;
}

**UserC.js**


import React, {Component} from 'react';

export default class UsersC extends Component{
    render(){
        return (
            <h3 className={this.props.rang}> from heading  </h3>
        );
    }
}

Answer 1

将texg 更改为txtg

 <React.Fragment>
      <h2 className= 'texg'> Hello Css </h2>
        //To
       <h2 className= 'txtg'> Hello Css </h2>
      <UsersC rang={style ? 'textg' : 'textb' } />
  </React.Fragment>