I do make a style in my react project. Like as
style.css:
.headingStyle {
background-color: purple;
text-align: center;
}
and my react component is:
import React from 'react'
import '../cse_component/style.css'
export default function heardTitle() {
return (
<div>
<h1 ClassName='headingStyle'>Todo List</h1>
</div>
)
}
But why I can not change anything in my project?
I think you misstype the className prop. It should be className not ClassName using capital C.
Try changing it from this
<h1 ClassName='headingStyle'>Todo List</h1>
into this:
<h1 className='headingStyle'>Todo List</h1>
I guess there is a typo error on ClassName use className.
import React from 'react'
import '../cse_component/style.css'
export default function heardTitle() {
return (
<div>
<h1 className='headingStyle'>Todo List</h1>
</div>
)
}
For inline css use the code as <h1 style={{ background-color: purple;text-align: center; }} >Todo List</h1>