Как разделить правила CSS для файлов в реагировать? - PullRequest
Новая
       116

Как разделить правила CSS для файлов в реагировать?

0 голосов
/ 20 ноября 2018

Я работаю над двумя страницами в ReactionJS. Одна из них является целевой страницей, а другая - страницей статей. Проблема, с которой я сталкиваюсь, заключается в том, что правила CSS для целевой страницы влияют на внешний вид страницы статей. Я думаю, что это связано сactjs, так как он объединяет все CSS-файлы в один. Как разделить правила CSS для каждой страницы, чтобы правила CSS одной страницы не влияли на внешний вид другой?

Ответы [ 3 ]

0 голосов
/ 20 ноября 2018

Существуют определенные способы достижения CSS с определенной областью.Но лучший и самый простой способ сделать это - css-modules .

Более того, вы можете найти эту статью полезной.

0 голосов
/ 20 ноября 2018

Лично я думаю, что самый простой способ - написать css на js.Нет необходимости отделять CSS от JS.Просто напишите их вместе.Например, 

const newComponent=props=>{
   <div style={{ display: "flex", alignItems: "center", justifyContent: "center" }}>
     <button type="primary">Confirm</button>
     <button type="primary">Cancel</button>
   </div>
}

Вы также можете обратиться к третьей библиотеке, radium, которая поможет вам написать более продвинутый css.https://formidable.com/open-source/radium/

Если вы собираетесь научиться реагировать на нативный язык в будущем, вы обнаружите, что все CSS написаны на языке js.Я надеюсь, что это поможет.

0 голосов
/ 20 ноября 2018

присвойте body уникальный идентификатор / идентификатор или создайте div для каждой страницы, например

<body class="landing-page"> or <div class="landing-page"> а также <body class="article-page"> or <div class="article-page">

затем напишите css как: 

.lanading-page .your-selector{
    cssrules
}

Другие опции:

...