À visualiser ici :
Il est très synthétique et résume la quasi-intégralité de HTML et CSS...
Publier une vidéo dans une page web n'est pas toujours évident: Selon le format (AVI, MPG, MOV...) tout le monde ne possède pas forcément le bon plugin et le bon codec.
mencoder mavideo.avi -o mavideo.flv -of lavf -oac mp3lame -lameopts abr:br=56 -ovc lavc -lavcopts vcodec=flv:vbitrate=400:mbd=2:mv0:trell:v4mv:cbp:last_pred=3 -srate 22050 -lavfopts i_certify_that_my_video_stream_does_not_use_b_frames
<html> <head> <title>Ma vidéo</title> </head> <body> <noembed> <object style="width:320px;height:260px"> <param name="movie" value="flvplayer.swf?file=mavideo.flv" /> <param name="quality" value="high" /> </object> </noembed> <embed width="320" height="260" src="flvplayer.swf?file=mavideo.flv" quality="high" type="application/x-shockwave-flash" /> </body> </html>
Les logiciels WYSIWYG de création de pages web produisent parfois du contenu HTML rempli de balises HTML inutiles, voire incompatibles avec les recommandations du W3C.
Si vous écrivez des documentations au format HTML, il peut être utile de symboliser des touches de clavier, par exemple lorsque l'utilisateur est invité à saisir une certaine combinaison de touches.
<style type="text/css">
<!--
body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; background-color:white; }
span.touche
{
margin-right: 1px;
padding-left:2px;
padding-right:2px;
border: 1px solid #6f6f6f;
background-color: #cfcfcf;
border-radius: 0.2em;
font-weight: bold;
-moz-border-radius: 0.2em;
}
-->
</style>
Tapez <span class="touche">A</span>
<span class="touche">↵Entrée</span>
<style type="text/css">
<!--
body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; background-color:white; }
span.touche
{
margin-right: 1px;
padding-left:2px;
padding-right:2px;
background-color: #dadada;
border-radius: 0.2em;
-moz-border-radius: 0.2em;
font-weight: bold;
border-style:outset;
border-width:2px;
}
-->
</style>
Tapez <span class="touche">A</span>
<span class="touche">↵Entrée</span>
Parfois, il peut être utile d'afficher des informations supplémentaire au survol du curseur sur une zone de l'écran, par exemple "Cliquez pour agrandir" sur une image, un descriptif sur une abbréviation ou des détails sur un lien.
Des accords avec l'<acronym title="Organisation du Traité de l'Atlantique Nord">OTAN</acronym> ont été passés.
<span title="C'est le logo de CommentÇaMarche"> <img src="http://www.commentcamarche.net/img/commentcamarche.png"> Logo de CCM </span>
Vous avez fait une image cliquable en mettant une balise IMG au sein d'un lien <a href=""></a> et le navigateur vous affiche un cadre ou plus exactement une bordure autour de l'image.
<A HREF="ourson_de_mer.html"><IMG SRC="petit_ours_plongeur.gif" ALT="Photo d'un bébé ours dans l'eau salée." BORDER="0"></A>
a img
{
border: none;
}
<style type="text/css">
a:link
{
text-decoration:none;
}
</style>
<style type="text/css">
a.nounderline:link
{
text-decoration:none;
}
</style>
<a href="/" class="nounderline">Texte du lien</a>
<a href="/" style="text-decoration:none">Texte du lien</a>
Lors de la réalisation d'un site web il faut utiliser un langage maintenant incontournable dans le monde du WEB le CSS : Feuilles de style en cascade (Cascading Style Sheets) il permet de faire la présentation du site web.
<style type="text/css"> <!-- Mon code CSS --> </style>
<style type="text/css">
<!--
@import url("source/page.css");
-->
</style>
<link rel="stylesheet" type="text/css" href="source/page.css" media="all"/>
