How to Add a Class in JSX

Nayetwolf answered on June 16, 2022 Popularity 9/10 Helpfulness 1/10

answer How to Add a Class in JSX

related Add A Class In React

How to Add a Class in JSX

Comment

/* We can add attributes to the JSX elements, 
for example id and class, the same as in HTML! */

import React from "react";
import ReactDOM from "react-dom";

const App = () => {
  const id = "some-id";
  return (
    <div>
      <h1 id={id}>This is a heading</h1>
      <h2 className="active">This is another heading</h2>
    </div>
  );
};

/* Note that in React, we need to use className instead of class.*/

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Popularity 9/10 Helpfulness 1/10 Language javascript

Source: www.freecodecamp.org

Tags: add class javascript jsx

Link to this answer
Share Copy Link

Contributed on Aug 18 2022

Nayetwolf

0 Answers Avg Quality 2/10

Closely Related Answers

Add A Class In React

Comment

/*App.jsx*/

import React from 'react';

export function App(props) {
  return (
    <div className='App'>
      <h1 className="someClass">Hello React.</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}
 /*style.css*/
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  background-color: #18222d;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.App {
  color: #72a24d;
}
.someClass
{
  color: red;
}

Popularity 10/10 Helpfulness 2/10 Language javascript

Source: Grepper

Tags: add

Link to this answer
Share Copy Link

Contributed on Jun 16 2022

Javasper

0 Answers Avg Quality 2/10

How to Add a Class in JSX

Contents

More Related Answers

How to Add a Class in JSX

Closely Related Answers

Add A Class In React

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.