how to change the font color, font size, and button color in React

Question

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

Solution 1

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...}

Solution 2

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'
}

Solution 3

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.

Comments

[Randall]

add your'e code without code we can't help

[לבני מלכה]

CODE not images please