Background div gradient

<!DOCTYPE html>
<html>
<head>
	<title>BACKGROUND OVERLAY | par NGLESSON</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="keyword" content="BACKGROUND OVERLAY">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
	<link href="style.css" rel="stylesheet">
</head>
<body>
	<div class="container">
		<div class="row">
			<div class="col-12">
				<div class="gradient mt-5 mb-5">
					<h1>
						<u>01</u> A propos de nglesson
					</h1>
					<p>
						Quo cognito Constantius ultra mortalem modum exarsit ac nequo casu idem Gallus de futuris incertus agitare 
						quaedam conducentia saluti suae per itinera conaretur, remoti sunt omnes de industria milites agentes in civitatibus perviis.
					</p>
				</div>
				<div class="info mt-5 mb-5">
					  <h1>
						  <u>02</u> Info de nglesson
					  </h1>
					  <p>
						Quo cognito Constantius ultra mortalem modum exarsit ac nequo casu idem Gallus de futuris incertus agitare 
						quaedam conducentia saluti suae per itinera conaretur, remoti sunt omnes de industria milites agentes in civitatibus perviis.
					 </p>
				</div>
			</div>
		</div>
	</div>  
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>                       
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> 
</body>
</html>
body {
    color:#FFF;
}

.gradient {
    padding: 20px;
    background-image: linear-gradient(to right, tomato, orangered);
}  
u {
  text-underline-position: under;
}
.info {
    background-image: linear-gradient(to right, springgreen, green);
    padding: 20px;
}

                                    
Alert Bootstrap4 style02

Alert Bootstrap4 style02

Card 4 Product Style01

Card 4 Product Style01

Card Bootstrap4 E commerce 01

Card Bootstrap4 E commerce 01

Carousel Bootstrap4

Carousel Bootstrap4

Compteur avec b4

Compteur avec b4

Créer des tds dynamiquement dans une table html

Créer des tds dynamiquement dans une table html

Form Step With B4 Style01

Form Step With B4 Style01

Input range slider HTML style05

Input range slider HTML style05

Nav Menu style02

Nav Menu style02

Profile page with b4

Profile page with b4

Timeline style06

Timeline style06

toggle switch style02

toggle switch style02