Question

这是<MessageHeader />组件的文件夹结构。

import React, { Component } from 'react';
import style from '../css/MessageHeader.css';
import { fa, fa_question } from '../icons/icons';

    class MessageHeader extends Component {
        render(){
            return(

                <div className={style.container}>
                    <span className={[fa, fa_question].join(' ')} />
                </div>
            );
        }
    }

    export default MessageHeader;

这是icons.js文件

import fontAwesome from 'font-awesome/css/font-awesome.css';

const { fa, 'fa-question':fa_question } = fontAwesome;

export {
    fa,
    fa_question
}

现在我要添加此内容：

.fa-question {
    color: white
  }

我该怎么做。请帮助我是新来应对生态系统的人。

Answer 1

我假设您正在使用create-react-app创建您的项目。您可以在项目上创建style.css文件（例如，在icon.js文件旁边），然后将其导入到项目中。

import "./style.css";

您也可以使用注释中提到的Revansiddh的内联样式。

<span className={[fa, fa_question].join(' ')} style:{{color: "#FFF"}} />

如何在模块化CSS React中更改Fontawesome图标的颜色

1 个答案: