Html css
- 1. XHTML / CSS Xavier VANDEWIELE Net-Fabrikwww.net-fabrik.fr
- 2. Xhtml / Css complémentaires Body{ Background-color:#000000; Font-family:arial; color:#ffffff; } H1{ Font-size:15px; Font-decoration:underline; } P{ Font-size:10px; Padding-left:20px; } <html> <header> </header> <body> <h1>mon premier html</h1> <p>mon premier paragraphe</p> </body> </html>
- 3. Création de notre première page <html> <header> </header> <body> <h1>mon premier html</h1> <p>mon premier paragraphe</p> </body> </html>
- 4. Premier style Css <header> <link rel="stylesheet" href="URL" type="text/css" media="all" /> </header> Body{ Background-color:#000000; Font-family:arial; } H1{ Font-size:15px; Font-decoration:underline; } P{ Font-size:10px; }
- 6. Nommer les éléments <p class="entete"> <divid="contenu"> <html> <header> </header> <body> <h1>mon premier html</h1> <p>mon premier paragraphe</p> <div id="albphoto"> <imgsrc='url' class='photo'/> <imgsrc='url' class='photo'/> </div> </body> </html>
- 8. Positionnement d’éléments #albphoto{ Width:150px; Heiht:320px; Background-color:#0099FF; Border:1px solid #003399; } .photo{ Width:130px; Margin-bottom:20px; margin-top:20px; margin-left:10px; }
- 9. Float #actu{ width:600px; background-color:#E19F66; } .contenu{ float:left; width:450px; } .photo{ Width:130px; Margin-bottom:20px; margin-top:20px; margin-left:10px; float:left; } .clear{ clear:both; } <div id="actu"> <p class="contenu">mon premier paragraphe mon premier paragraphe</p> <imgsrc='img/Image1.png' class='photo'/> <div class="clear"></div> </div>
- 10. Des styles en cascade #actu{ width:600px; background-color:#E19F66; } #actu p{ float:left; width:450px; } #actu img{ Width:130px; Margin-bottom:20px; margin-top:20px; margin-left:10px; float:left; } .clear{ clear:both; }
- 11. Du HTML Pour jimdo Les différents éléments à intégrer Le code html Le code css Les images Insertion des zones Jimdo
