javascript - how to change the font color, font size, and button color in React - Stack Overflow

admin管理员组

文章数量:1432163

when I try to change the price color, botton color and title font style, but it doesn't work. It didn't change anything. and how to create shadow

index.js index.js

panel.js Line 11 and line 22, try to change the price color

Botton.js Line 20 and lines 5-7, try to change the button color

Button.css button.css

when I try to change the price color, botton color and title font style, but it doesn't work. It didn't change anything. and how to create shadow

index.js index.js

panel.js Line 11 and line 22, try to change the price color

Botton.js Line 20 and lines 5-7, try to change the button color

Button.css button.css

• javascript
• html
• css
• reactjs

Share Improve this question Follow asked May 21, 2018 at 5:53 Peishi LongPeishi Long 6911 gold badge44 silver badges99 bronze badges 2

• 1 add your'e code without code we can't help – Randall Commented May 21, 2018 at 5:56
• 1 CODE not images please – לבני מלכה Commented May 21, 2018 at 5:59

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

You write inline style...

<Panel style={{color:'red'}}>

or

<Panel className="sample"> 

in your style.css file just use

.sample {
 your style here....
}

or else

<Panel className={styles.sample}>

then write your style inside

.sample{style here...}

The color attribute doesn't work in HTML5. You should use style="color: red;" or wrap the content in <font color="red">.

<p style={"color: " + color}>
  Blah blah blah
</p>

or

<p>
  <font color={color}>
    Blah blah blah
  </font>
</p>

As for the button, your backgroundColor is bule. I'm guessing it should be blue?

Your CSS file also won't be applied since there is no backgroundColor class on your button and no fontStyle class on your paragraph.

Remember in react you are writing JSX and not html. For inline styling the p element you have to do this

On line 22 of panel.js,

<p className = "Autoprice" style = {{color:color}}>{price}</p>

On Botton.js

on line 6

const styles = {
  color:'blue',
  background-color:'blue'
}

本文标签：