Блог

Главная - Вопросы по программированию - как я могу связать таблицу стилей css с классами react

как я могу связать таблицу стилей css с классами react

#css #reactjs

#css #reactjs

Вопрос:

как я могу прикрепить таблицу стилей css к этому компоненту класса divs в этой оболочке div 

 class Home extends Component {

          render() {
            return (

                <div class='wrapper'>
                                <NavMenu />
                                <HomeHeader />
                                <TopMain />
                                <HomeMain />
                                <Footer />
                      </div>
                );
              }
              }

              export default Home;

это таблица стилей
например 

 .NavMenu {
…
…
…

}

это правда?

или это, например ==>> 

     <NavMenu className='navmenu'/>
    <HomeHeader className='HomeHeader'>
....

Комментарии:

1. вы назвали свой класс, wrapper поэтому внутри .css файла он также должен быть вызван .wrapper

2. Пожалуйста, отредактируйте свой вопрос, чтобы указать документацию / учебные пособия / примеры, которые вы использовали для ознакомления с CSS, и почему это не помогло. Спасибо.

3. да, я не использовал этот компонент стиля css

Ответ №1:

Вы должны создать файл css, например App.css , и в свой компонент вы должны включить этот файл. Я всегда создаю classname для каждого класса.

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

class App extends Component {
...
render(){
return(
    <div>
      <NavMenu className="classA"/>
      <HomeHeader className="classB"/>
      <TopMain className="classC"/>
      <HomeMain className="classA"/>
      <Footer className="classB"/>
    </div>
);
}
}

И это сделано!
Это должно сработать!

Комментарии:

1. Вы также можете просмотреть документы по стилизованным компонентам . Я думаю, что это очень важно и, возможно, решит ваш вопрос.