Outils pour utilisateurs

Outils du site


clubinfo:premier_site_avec_css

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
clubinfo:premier_site_avec_css [2023/07/21 08:35]
mrcjl
— (Version actuelle)
Ligne 1: Ligne 1:
-====== Premier site en CSS ====== 
- 
-=====Présentation===== 
-====But==== 
-Mettre en forme notre site pour le rendre plus agréable à regarder. Si le HTML décrit le contenu, le [[CSS]] décrit la mise en forme. 
- 
-==== Connaissances de base ==== 
-Revoir le cours sur le [[clubinfo:CSS]] 
- 
-==== Activité ==== 
-Pour mettre en forme nous allons : 
-    * Diminuer la largeur de la page HTML (comme sur ce wiki) et mettre une couleur de fond pour la balise <body> 
-    * Améliorer la présentation du menu de la page d'accueil <ul><li> 
-    * Améliorer la présentation des titres de page <h1> 
-    * Faire gérer par la feuille de style l'image du pont <img class='grandeimg'> 
-    * Rendre plus évidents les lieux et les type< class='xx'> 
- 
-=====Déroulement===== 
- 
-====Modification des pages existantes==== 
-Nous allons ajouter la balise permettant d'insérer la feuille de style dans l'entête de toutes les pages. La feuille de style s'appellera "style1.css". 
- 
-<WRAP round tip> 
-====Mise en forme utiles==== 
-  *  
- 
-=====Exemple===== 
-{{:cours:cp.png?20 |}}++++Coup de pouce | 
- 
-==== Ajouter la feuille de style ==== 
-<code html> 
-    <link rel='stylesheet' href='style1.css' type='text/css' /> 
-</code> 
- 
-===== Code de la feuille de style ===== 
-<code css style1.css> 
-body { 
- margin-left: 150px; 
- margin-right: 150px; 
- background-color: silver; 
-} 
-ul { 
- margin-left: 100px; 
- background-color: green; 
-} 
-li { 
- font-size: 18px; 
- font-weight: bold; 
- color: yellow; 
- text-decoration: none; 
- padding-top: 5px; 
- padding-bottom: 5px; 
-        border: 1px solid black; 
-} 
-h1 { 
- color: navy; 
- margin-top: 0px; 
-} 
-p.description { 
- text-align: justify; 
-} 
-img.grandeimg { 
- width: 400px; 
- float: left; 
- margin-right: 20px; 
-} 
-p.categorie { 
- color: navy; 
- float: left; 
- margin: 0px; 
- padding-right: 100px; 
-} 
-P.lieu  { 
- color: navy; 
- float: left; 
- margin: 0px; 
- padding-right: 100px; 
-} 
-</code> 
-++++ 
- 
-===== Inconvénients ===== 
-Il n'y a que des avantages à utiliser le CSS.  
- 
-Pour notre site, il est toujours nécessaire de créer une nouvelle page complète par nouveau pont et de modifier le menu. Nous pouvons améliorer cela après avoir découvert la [[création de la base de données]] pour notre [[premier site SQL]].  
  
clubinfo/premier_site_avec_css.1689921301.txt.gz · Dernière modification: 2023/07/21 08:35 de mrcjl