How to change paragraph size in react js?
October 14, 2024Hi Friends π,
Welcome To aHoisting!
To change paragraph size in react js, you can set font-size: 30px;
in .font-text
. It will change paragraph size in react js.
Today, I am going to show you, how to change paragraph size in react js.
Table of contents
- Install and create a new React app.
- Import react component.
- Create a Component.
Letβs start with the first step.
Step 1: Install and create a new React app.
First you have to install the React project. You should use create-react-app
command to create a new React project.
npx create-react-app my-app
cd my-app
npm start
Step 2: Import react component.
After installing, you have to import your React component.
import React from 'react';
import './App.css';
Step 3: Create a Component.
You can use className="font-text"
to change paragraph size in react js.
<div>
<p className="font-text">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>
</div>
Change paragraph size example.
The below code is an example of a React. You have to import './App.css'
and set font-size: 30px;
in .font-text
to change paragraph size in react js.
App.js
import React from 'react';
import './App.css';
function App() {
return (
<div>
<p className="font-text">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</p>
</div>
);
}
export default App;
App.css
.font-text {
font-size: 30px;
}
In the above code example, I have used the font-size: 30px;
to change paragraph size in react js.
Check the output of the above code.
All the best π