User Tools

Site Tools


2017_2018:s1:webdoc:td3

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
2017_2018:s1:webdoc:td3 [2017/11/23 09:11]
pourcelot [Autour des boites]
2017_2018:s1:webdoc:td3 [2017/11/23 09:23] (current)
pourcelot [Autour des boites]
Line 132: Line 132:
 Mettez en commentaire la ligne du script CSS fourni qui les désactive, et visualiser à nouveau l'HTML dans un navigateur. Mettez en commentaire la ligne du script CSS fourni qui les désactive, et visualiser à nouveau l'HTML dans un navigateur.
  
 +<note tip>Les marges permettent également de centrer des conteneurs (block).
  
-<note tip>Par défaut, lorsqu'​on indique ​la taille d'un conteneur ​(block), à l'aide des propriétés CSS ''width''​ et ''​height''​, les bordure et les marges externes ne sont pas prises en compte.+Il suffit de préciser ​la largeur de l'élément ​(''​width''​), puis de fixer ''​margin-left''​ et ''​margin-right''​ à ''​auto''​.
  
-Il est souvent plus pratique ​lorsqu'on crée une mise en page de faire en sorte que les dimensions indiquées soient celles du conteneur //marges comprises//​. Pour changer la méthode de calcul de la taille d'un conteneur pour //tous// les éléments de la page, écrivez ''​*{box-sizing:​ border-box;​}''​ au début de votre feuille CSS.</​note>​+<code css> 
 +#monbloc {width: 500px; 
 +          margin-left:​auto;​ 
 +          margin-right:​auto;​} 
 +</​code>​ 
 +</​note>​ 
 + 
 +<note tip>Par défaut, lorsqu'​on indique la taille d'un conteneur, à l'aide des propriétés CSS ''​width''​ et ''​height'',​ les bordures et les marges externes ne sont pas prises en compte. 
 + 
 +Il est souvent plus pratique ​lorsque l'on crée une mise en page de faire en sorte que les dimensions indiquées soient celles du conteneur //marges comprises//​. Pour changer la méthode de calcul de la taille d'un conteneur pour //tous// les éléments de la page, écrivez ''​*{box-sizing:​ border-box;​}''​ au début de votre feuille CSS.</​note>​
  
 ===== Mise en pratique ===== ===== Mise en pratique =====
Line 179: Line 189:
   - Une **version HTML de votre CV**. Intégrez ensuite votre CV sur la page Web crée lors des TD précédents en utilisant une iframe. Rendez le tout (page web + CV intégré) sous forme d'une archive **ZIP**. Rajoutez également un lien pour pouvoir afficher votre CV sur une page indépendante.   - Une **version HTML de votre CV**. Intégrez ensuite votre CV sur la page Web crée lors des TD précédents en utilisant une iframe. Rendez le tout (page web + CV intégré) sous forme d'une archive **ZIP**. Rajoutez également un lien pour pouvoir afficher votre CV sur une page indépendante.
  
-vous pouvez faire un rendu par binôme, à condition de bien faire apparaître les deux noms du binôme dans tous les documents à rendre.+Vous pouvez faire un rendu par binôme, à condition de bien faire apparaître les deux noms du binôme dans tous les documents à rendre.
 </​note>​ </​note>​
  
2017_2018/s1/webdoc/td3.1511424719.txt.gz · Last modified: 2017/11/23 09:11 by pourcelot