0% ont trouvé ce document utile (0 vote)
1 vues2 pages

TP4 CSS

Le document présente un exercice de CSS où diverses modifications de style doivent être appliquées à des éléments HTML. Les tâches incluent le changement de couleur et de police pour le titre et le paragraphe, la personnalisation d'un bouton, et l'ajout de styles pour des divs et une image. Les instructions précisent également des effets visuels comme des ombres et des transitions.

Transféré par

medamine.safio
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
1 vues2 pages

TP4 CSS

Le document présente un exercice de CSS où diverses modifications de style doivent être appliquées à des éléments HTML. Les tâches incluent le changement de couleur et de police pour le titre et le paragraphe, la personnalisation d'un bouton, et l'ajout de styles pour des divs et une image. Les instructions précisent également des effets visuels comme des ombres et des transitions.

Transféré par

medamine.safio
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

TP 4 CSS

Exercice 1 :

<h1>Titre principal</h1>
<p>Paragraphe simple</p>
<button>Cliquer ici</button>
<div class="box">Contenu</div>
<div class="section">Bonjour</div>
<p class="text">Application CSS</p>
<img src="[Link] alt="image">
<div class="bordure">Filière SICN 1</div>

Travail demandé
Pour le h1, p

• Mettre le titre en bleu et le paragraphe en gris ,Changer la police (Arial par


exemple) et Centrer le texte

Pour le bouton

• Donner une couleur de fond (ex: vert) et Mettre le texte en blanc


• Ajouter des bordures arrondies et Ajouter un effet hover (changer couleur)

Pour div box

• Ajouter une largeur (200px) et un fond (ex: lightblue) ,ajoutert du padding et


une bordure et Centrer la boîte

Pour div section

• Ajouter une couleur de fond, une image de fond et centrer l’image


• Empêcher la répétition de l’image

Pour la balise p

• Mettre en majuscules et ajouter espace entre les lettres et ajouter une ombre au
texte

Pour l’image : Ajouter un effet zoom au hover et une transition douce


Pour Div bordure

• Ajouter une bordure noire


• Faire des coins arrondis et ajouter une ombre (box-shadow)

Vous aimerez peut-être aussi