JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="fr">


<head>
	<meta charset="utf-8"/>
	<title>Vol_hélico.html</title>
	<link rel="stylesheet" type="text/css" href="helico.css" /> <!--href"" vide pour essai. Nom de fichier CSS helico.css-->
	
</head>


<body style="background-color:#b8f6f7;"><!--Couleur de fond de la page en bleu-->

<h1>DEBUTER EN HELICOPTERE RADIOCOMMANDE</h1>
<p style="text-align: center;"><!--Centre l'image horizontalement-->
		<img src="file://C:\Users\Perso\Pictures\helico1.jpg"alt"Photo d'un hélicoptère"/><!--Affiche l'image-->
</p>
<h3>ALLER DIRECTEMENT A LA PARTIE TRAITANT DE :</h3>
<div>
	<ul class="multi-colonnes">
		<li><a href="#recom">Recommandations aux débutants</a></li>
		<li><a href="#choix">Choix du modéle</a></li>
		<li><a href="#conseils">Conseils lors de l'achat d'un modèle</a></li>
		<li><a href="#pilotage">Concernant l'apprentissage du pilotage</a></li>
		<li><a href="#cyclique">Le plateau cyclique</a></li>
		<li><a href="#rotor principal">Le rotor principal</a></li>
		<li><a href="#anticouple">Le rotor anticouple</a></li>
		<li><a href="#radio">La radiocommande</a></li>
		<li><a href="#prop">La propulsion</a></li>
		<li><a href="#servos">Les servos</a></li>
		<li><a href="#gyro">Le gyroscope</a></li>
		<li><a href="#cons-mont">Conseils de montage</a></li>
		<li><a href="#import">Important</a></li> <!--Lien hypertexte-->
		<li><a href="#photos montage">Quelques photos de montage</a></li>
	</ul>
</div>

<hr>			
		
<h3 id="recom"></h3>
<h3>RECOMMANDATIONS AUX DEBUTANTS :</h3>

<ul>
	<li>Faire èvoluer un modèle radiocommandé n'est pas sans danger. L'hélicoptère peut provoquer des blessures, voir des amputations graves, selon la taille des rotors.</li>
	<li>Respecter les distances de sécurité, concernant le public, ou des visiteurs éventuels.</li>
	<li>Maintenir le modèle en bon état, mécanique et électronique.</li>
	<li>Choisir un terrain bien dégagé, avec une aire de décollage/atterrissage adéquate.</li>
	<li>Avant le vol, toujours vérifier...

CSS

h1 {
	font-family: "Comic Sans MS";
	font-size:250%; 
	color: #ff9900; 
	text-align: center; 
	text-shadow: 3px 3px grey;
	}
	
	h3 {
	font-family: "Comic Sans MS";
	color: #ff9900; 
	padding-left: 10px; /* Décale les titres de paragraphe à droite*/
	}
		
	p {
	color: #6f1ea5;
	font-family: "Comic Sans MS";
	font-size:130%; 
	padding-left: 10px; /* Paragraphe décalé à droite*/
	}

li {
	font-size:130%;
	}
	
	.multi-colonnes {
		padding-left: 15px;
		column-count: 4;/*Affiche la liste sur 4 colonnes*/
		column-fill: balance;
		list-style-position: inside;
		}
		
		ul {
			color: #6f1ea5;
			font-family: "Comic Sans MS";
			margin: 10px;
			display: inline-block;
			border: blue double;
			border-radius: 10px;
			box-shadow: 4px 4px 4px blue;
			}
		
	.image{
		float:left;
		margin: 0 15px 15px 0 /* Place le texte à droite de l'image*/
		}