Styling in React.js

Today we are going to learn styling in css and how to declare variables and all.

For styling we can use inline and external file css which can be component based or page based. So we are going to use className for naming the component.

Also we can use variable for reuse value through the component.

Given below the example

 <div className="nav-wrapper">
      <nav className='nav-heading'>{c}</nav>
      <ul className='nav-items'>
        <li>Home</li>
        <li>Contact</li>
        <li>About</li>
      </ul>
    </div>

Css Code

.nav-wrapper{
    display: flex;
    height: 80px;
    background-color: aliceblue;
    width: 100vw;
    padding: 0 !important;
}