DEVELOPPEMENT WEB 1

Exercice 1

1- Créer une page acceuil.html comportant le code HTML suivant :

<h1>Le langage HTML </h1>

<p class="note">texte en travaux</p>

<div class="forme"> <h2>HTML</h2> HTML est un langage hypertexte à <strong> balises. </strong>
Il est utilisé pour créer des

pages web <br/>

</div>

<h2>Exemples de balises</h2>

<ol> <li>Balises de titre

<ul> <li> &lt h1> </li> <li> &lt h2> </li> <li> &lt h3> </li> <li> ... &lt h6> </li>

</ul>

<li>Balise de style</li>

<li>etc.</li> </ol>

<a href="acceuil.html">encore un</a>

2- Ajouter une feuille de style externe nommée style.css permettant d’obtenir les effets
suivants illustrés dans la figure ci-dessous :

HANENE CHETTAOUI HAMROUNI 1

 DEVELOPPEMENT WEB 1

- Le lien hypertexte doit avoir une couleur rouge pour les liens non visités, couleur
jaune pour les liens visités, la couleur bleue lorsque la souris passe au-dessus du lien et
la couleur verte lorsque le lien est activé.
- font-weight:bold  mettre un texte en gras

Exercice 2

On vous donne le code HTML suivant :

<div id="menu">

<h1 class="fond">Le langage <b class="jaune">CSS</b></h1>

<ol>

<li> Introduction </li>

HANENE CHETTAOUI HAMROUNI 2

 DEVELOPPEMENT WEB 1

<li> Types de sélecteurs </li>

<li> Intégration des <b class="jaune">CSS</b></li>

<li> Propriétés dans les <b class="jaune">CSS</b></li>

</ol>

</div>

<div id="pied">

<h3 class="question"> FAQ</h3> <br>

<h3> Fin de la page </h3>

<div>

Ajouter le code CSS approprié afin d’obtenir la page suivante :

Page résultat

Exercice 3

1- Créer une page page.html comportant le code HTML suivant :

<p>Un <a href="#" target="_blank">lien</a> vide</p>

<p class="test">Un autre <a href="#" rel="follow">lien</a> vide</p>
<p>Un troisième <a href="#" rel="nofollow">lien</a> vide</p>

Ajouter le code CSS approprié afin d’obtenir la page suivante :

HANENE CHETTAOUI HAMROUNI 3