BRE03

Exercices Cookies

Les contenus du cours BRE03 Web Dev Course © 2024 par Mari Doucet sont sous licence CC BY-NC-SA 4.0

Étape 0

Placez-vous dans le dossier bre03-php-j6 de votre IDE et créez un dossier cookies.

Étape 1

Créez un fichier index.php avec le code HTML suivant :

<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Exercice cookie</title>
		<link rel="stylesheet" href="default.css" />
	</head>
	<body>
		<h1>
			Sed sint laboriosam et blanditiis architecto cum aspernatur placeat. 
		</h1>
		<p>
			Lorem ipsum dolor sit amet. Nam error beatae sed vitae ipsa et libero officiis ut minus eaque hic porro quidem eum dolor aliquam? Et molestiae beatae in odit magni eos sapiente dignissimos! 
		</p>
		<h2>
			Est omnis quas sed voluptatem dicta eum vitae itaque! 
		</h2>
		<p>
			Ea ratione minima et nihil excepturi non itaque iure aut assumenda velit a quisquam amet et dolorem maxime et dicta illum. At architecto quia id voluptatem quisquam sit aspernatur sapiente quo aperiam sequi sit mollitia veritatis. Nam placeat distinctio ut soluta doloremque ab debitis quis? 
		</p>
		<h3>
			Aut magni consequuntur in omnis error aut internos molestias. 
		</h3>
		<p>
			Aut culpa recusandae sed ducimus velit vel omnis velit et beatae quae At galisum quam ut explicabo delectus in nisi suscipit. Ab distinctio dolorum in quam quam et provident rerum. 
		</p>
	</body>
</html>

Étape 2

Créez trois fichiers CSS :

default.css où le texte de la page apparait en noir.

red.css où le texte de la page apparait en rouge.

blue.css où le texte de la page apparait en bleu.

Étape 3

Créez un fichier select_cookie.php qui affiche un formulaire qui contient un select de choix de couleur avec trois choix : Noir, Rouge et Bleu et dont l’action est index.php et la méthode POST.

Dans index.php, avant le code HTML si le choix de couleur existe dans POST stockez le dans un cookie.

Utilisez ensuite le cookie pour créer une condition qui changera le fichier CSS :

(Sur certains ordinateurs vous aurez peut-être besoin de recharger la page pour voir la modification apparaitre).