Aide-mémoire XHTML & CSS

Force_IT

Le téléchargement nécessite un accès à la bibliothèque YouScribe
Tout savoir sur nos offres

5 pages

Français

Le téléchargement nécessite un accès à la bibliothèque YouScribe
Tout savoir sur nos offres

A propos
Informations
Extrait

Description

Aide-mémoire d'intructions CSS et balises HTML (corps, listes, tables, images, liens et ances,...)

Informations

Publié par	Force_IT
Nombre de lectures	286
Licence :	En savoir + Paternité, pas d'utilisation commerciale, partage des conditions initiales à l'identique
Langue	Français

Extrait

Cours Web
Aide-mémoire XHTML & CSS

Semaine du 5 octobre 2009

1 XHTML
– <!−−Commentaire−−>

1.1 Prologue
– <!DOCTYPE htmlPUBLIC "−//W3C//DTD XHTML 1.0 Strict//EN"
" http://www.w3.org/TR/xhtml1/DTD/xhtml1−strict.dtd">
– <html xmlns="http://www.w3.org/1999/xhtml"xml:lang="fr"lang="fr">
. . .
</html>

1.2 En-tête
– <head</. .> .head>
– <meta http−equiv="Content−Type"content="text/html; charset=utf−8" />
– <title</. .> .title>
– <link rel="stylesheet"href="style.css "type="text/css" />

1.3 Corps
– <body. .> .</body>
– <p</. .> .p>
– <h1> .. .</h1>, <h6. .> .</h6>
– <div> .. .</div>
– <br/>
– <hr/>
– <em. .> .</em>, <strong. .> .</strong>
– <span> .. .</span>

1.3.1 Listes
– <ol><li> .</. .li. .</> .ol>
– <ul><li</. .> .li</. .> .ul>
– <dl><dt</. .> .dt><dd. .</> .dd. .</> .dl>

1.3.2 Tables
– <table</> .. .table>
– <caption> .. .</caption>
– <tr</. .> .tr>
– <th> .. .</th>
– <td</. .> .td>

1.3.3 Images
– <img src="image.png"alt" />="texte alternatif

1.3.4 Lienset ancres
– <a href</. .="http://www.cnrs.fr/"> .a>
– <baliseid="toto"> .. .</balise>
– <a href</. .="#toto"> .a>

1.3.5 Attributscommuns à toutes les balises
–style
–class
–id

1.3.6 Formulaires

– <form method="post"action="script.php"enctype="multipart/form−data">
. . .
</form>
(enctypepeut être omis, il vaut alors application/x−www−form−urlencoded).
– <ﬁeldset. .> .</ﬁeldset>
– <legend</. .> .legend>
– <label for</="id_champ"> .. .label>
– <input type="text"name="nom"value="défaut"maxlength="42" />
– <input type="password"name="nom"value="défaut"maxlength="42" />
– <input type="checkbox"name="nom[]"value="valeur"checked="checked" />
– <input type="radio"name="nom"value="valeur"checked="checked" />
– <input type="ﬁle"name="nom" />

– <input type="hidden"name="nom"value="valeur" />
– <input type="reset"value="étiquette" />
– <input type="submit"value="étiquette" />
– <textarea name="nom"cols="80"rows. .</="5"> .textarea>
– <select name="nom">
<option value="valeur1"> .</. .option>
<option value="valeur2"selected="selected"> .. .</option>
</select>

– <select name="nom[]"multiple="multiple"size="5">
<option value="valeur1"> .</. .option>
<option value="valeur2"selected</. .="selected"> .option>
</select>

2 CSS
–/∗Commentaire∗/
–@importurl(feuille_annexe.css);
–sélecteur{propriété:valeur; }

2.1 Sélecteurs
sélecteur simple :balise
sélecteur multiple :sel1,sel2
sélecteur universel :∗
sélecteur de classe :,. classebalise. classe
sélecteur d’identiﬁant :#identiﬁant#identiﬁant, balise
sélecteur contextuel :sel1 sel2
pseudo-élément :balise: ﬁrst−line ,balise: ﬁrst−letter
pseudo-classes :a: visited ,a: link,activea:hover, a:

2.2 Valeurs
2.2.1 Longueurs
– %
– em,ex
– px
– mm,cm, in, pt, pc

2.2.2 Couleurs
–aqua,black,blue, fuschia,gray,green,lime,maroon,navy,olive,purple,red,
silver,teal,white,yellow
– rgb(255,255,255)
– rgb(100%,100%,100%)
– #FFFFFF