How to introduce css in react

Introduction methods include: 1. Inline style; 2. Declaration style, inline style is similar, the only difference is that a variable is declared to save the style sheet and bound to the style attribute; 3. Import introduction, React components are generally a folder , the folder contains the corresponding js and css, just introduce the same level css into js.

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

测试数据
 //报错

In React, if you write inline styles directly in the above way, an error will be reported directly, because JSX syntax is not supported. React supports the following three methods of writing css:

1. Inline style

... 
测试数据
 ...

2. Declaration style

Declaration style is similar to inline style. The only difference is that a variable is declared to save the style sheet and is bound to the style attribute. .

... 
测试数据
 ...

3.import introduction

A React component is generally a folder, which contains the corresponding js and css. As long as the same level is introduced in the js Just css.

import './mystyle.css';

Recommended learning:css video tutorial

The above is the detailed content of How to introduce css in react. For more information, please follow other related articles on the PHP Chinese website!