Changer le style du scroll bar in html

<!DOCTYPE html>
<html>
<head>
   <title>CHANGER LE STYLE DU SCROLL BAR IN HTML | 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="CHANGER LE STYLE DU SCROLL BAR IN HTML">
   <meta name="author" content="Mezgani said">
   <meta name="copyright" content="NGLESSON">
   <link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
	<div class="main">
      Sed si ille hac tam eximia fortuna propter utilitatem rei publicae frui non properat, 
      ut omnia illa conficiat, quid ego, senator, facere debeo, quem, etiamsi ille aliud vellet, rei publicae consulere oporteret?
      Quare hoc quidem praeceptum, cuiuscumque est, ad tollendam amicitiam valet; illud potius praecipiendum fuit, ut eam diligentiam
      adhiberemus in amicitiis comparandis, ut ne quando amare inciperemus eum, quem aliquando odisse possemus. 
      Quin etiam si minus felices in diligendo fuissemus, ferendum id Scipio potius quam inimicitiarum tempus cogitandum putabat.
      Alii nullo quaerente vultus severitate adsimulata patrimonia sua in inmensum extollunt, cultorum ut puta feracium multiplicantes 
      annuos fructus, quae a primo ad ultimum solem se abunde iactitant possidere, ignorantes profecto maiores suos, per quos ita magnitudo 
      Romana porrigitur, non divitiis eluxisse sed per bella saevissima, nec opibus nec victu nec indumentorum vilitate gregariis militibus 
      discrepantes opposita cuncta superasse virtute.
	</div>
</body>
</html>
::-webkit-scrollbar {
  width: 12px;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
  -webkit-box-shadow : inset 0 0 6px rgba(0,0,0,0.3); 
  -moz-box-shadow : inset 0 0 6px rgba(0,0,0,0.3); 
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  -khtml-border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  -khtml-border-radius: 10px;
  box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
  -webkit-box-shadow : inset 0 0 6px rgba(0,0,0,0.5); 
  -moz-box-shadow : inset 0 0 6px rgba(0,0,0,0.5);  
}
::-moz-scrollbar {
  width: 12px;
}
::-moz-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
  -webkit-box-shadow : inset 0 0 6px rgba(0,0,0,0.3); 
  -moz-box-shadow : inset 0 0 6px rgba(0,0,0,0.3); 
  border-radius: 10px;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  -khtml-border-radius:10px;
}
::-moz-scrollbar-thumb {
  border-radius: 10px;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  -khtml-border-radius:10px;
  box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
  -webkit-box-shadow : inset 0 0 6px rgba(0,0,0,0.5); 
  -moz-box-shadow : inset 0 0 6px rgba(0,0,0,0.5);  
}
::-o-scrollbar {
  width: 12px;
}
::-o-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
  -webkit-box-shadow : inset 0 0 6px rgba(0,0,0,0.3); 
  -moz-box-shadow : inset 0 0 6px rgba(0,0,0,0.3);  
  border-radius: 10px;
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  -khtml-border-radius:10px;
}
::-o-scrollbar-thumb {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  -khtml-border-radius: 10px;
  box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
  -webkit-box-shadow : inset 0 0 6px rgba(0,0,0,0.5); 
  -moz-box-shadow : inset 0 0 6px rgba(0,0,0,0.5);  
}


.main{
  width: 400px;
  height: 150px;
  overflow-y: scroll;
  margin: 80px 80px;
}

                                    
Alert Bootstrap4 style01

Alert Bootstrap4 style01

Alert Bootstrap4 style02

Alert Bootstrap4 style02

Chercher un mot sur la liste

Chercher un mot sur la liste

Create icon animate with svg

Create icon animate with svg

Double Scrollbar style in table 01

Double Scrollbar style in table 01

Image hover 04

Image hover 04

Image hover Flip Flap Style

Image hover Flip Flap Style

Manual Slideshow

Manual Slideshow

Partager sur les réseaux sociaux

Partager sur les réseaux sociaux

Timeline style06

Timeline style06

Titre section avec une bande style01

Titre section avec une bande style01

toggle switch style03

toggle switch style03