Lancez-Vous. C'est gratuit
ou s'inscrire avec votre adresse e-mail
HTML5/CSS3 par Mind Map: HTML5/CSS3

1. Les formulaires

1.1. Le construire

1.1.1. <form> </form>

1.2. L'organiser

1.2.1. <fieldset> </fieldset>

1.2.2. <legend> </legend>

1.2.3. Regrouper les éléments d'un fomulaire

1.2.4. Exemple

1.3. Les Attributs obligatoires

1.3.1. method

1.3.1.1. get

1.3.1.1.1. les données transitent par l'url

1.3.1.2. post

1.3.1.2.1. pour la majorité des cas

1.3.2. action

1.3.2.1. la redirection du formulaire

1.3.2.2. Attribut obligatoire pour une validation en W3C

1.3.3. Le code

1.3.3.1. <form method="post" action="traitement.php">

1.4. Les boutons

1.4.1. Cases à cocher

1.4.1.1. cheackbox

1.4.1.2. Exemple

1.4.2. bouton radio

1.4.2.1. radio

1.4.2.2. Attributs

1.4.2.2.1. checked

1.4.2.3. Exemple

1.4.3. Envoyer

1.4.3.1. submit

1.4.4. Annulation

1.4.4.1. reset

1.5. Zones de saisie

1.5.1. Libellés

1.5.1.1. <label for="pseudo"> votre pseudo </label>

1.5.1.2. Exemple

1.5.2. Monoligne

1.5.2.1. Texte

1.5.2.1.1. <input type="text" name="pseudo">

1.5.3. Multiligne

1.5.3.1. <textarea> </textarea>

1.6. Les input

1.6.1. email

1.6.1.1. Exemple

1.6.2. password

1.6.2.1. Exemple

1.7. Regrouper les zones

1.7.1. <fieldset> </fieldset>

1.7.2. les identifier

1.7.2.1. <legend> groupe1 </legend>

1.8. Zone de texte

1.8.1. <textarea> </textarea>

1.8.1.1. Zone de texte de plusieurs lignes

1.9. List

1.9.1. OL

1.9.1.1. liste ordonnée

1.9.2. UL

1.9.2.1. liste non ordonnée

1.9.3. LI

1.9.3.1. un élèment du liste

2. Les tableaux

2.1. Créer

2.1.1. Le tableau

2.1.1.1. <table> </table>

2.1.2. Un titre/légende

2.1.2.1. <caption> </caption>

2.1.2.1.1. Css

2.1.3. des entêtes

2.1.3.1. <th> </th>

2.1.4. des lignes

2.1.4.1. <tr> </tr>

2.1.5. des cellules

2.1.5.1. <td> </td>

2.1.6. Une fusion de bordure

2.1.6.1. Dans la CSS

2.1.6.2. border-collapse: collapse;

2.1.6.3. Exemple en code

2.1.7. Exemple en code

2.2. Mise en forme CSS

2.2.1. Bordures en CSS

2.2.1.1. border-collapse: collapse

2.2.1.1.1. Donne une bordure unique au tableau

2.2.1.1.2. Fusionne les bordures adjacentes

2.2.1.2. border: 1px solid black;

2.2.1.3. Exemple en code

3. Vidéo et Image

3.1. Vidéo

3.1.1. <video> </video>

3.1.1.1. Exemple

3.1.2. Si différents formats Vidéo

3.1.2.1. <source> </source>

3.1.3. Exemple

3.2. Image

3.2.1. Comment les mettre

3.2.1.1. <img src="exemple.png">

3.2.2. Attributs hauteur et largeur

3.2.2.1. height="600px"

3.2.2.2. width="500px"

3.2.3. élément d'image embarquée

3.2.3.1. alt="Exemple">

3.2.4. Exemple

4. Barre De Navigation

4.1. Le Construire

4.1.1. nav

4.1.1.1. liste ordonnée

4.1.1.1.1. un élèment du liste

4.1.1.2. exemple:

4.1.2. CSS

4.1.2.1. ol

4.1.2.1.1. supprimer l'apparece de liste

4.1.2.2. Li

4.1.2.2.1. afficher les éléments de la liste horizontalement

4.1.2.2.2. faire de l'espace entre les mots

4.1.2.3. a

4.1.2.3.1. supprimer le soulignement

4.1.2.3.2. couleur de text

4.1.2.3.3. si la souris touchant

5. Tags Sémentiques

5.1. à la place des div et span

5.2. header

5.3. main

5.4. footer

5.5. nav

6. Animations CSS

6.1. @keyframes

6.2. animation

6.2.1. animation-duration

6.2.2. animation-name

6.2.3. animation-delay

6.2.4. animation-iteration-count

6.3. un trés bon éxemple: