web-petitweb-petit

Ressources Ressources

Ressources libres, Open Source, et/ou relatives au Web et à l'accessibilité.

HTML : select

L’ élément HTML select permet de créer un menu déroulant dans un formulaire.
Il est utilisé avec l’élément form pour créer le formulaire, et l’ élémentoption pour la liste d’options.

<form>
<select>
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>

Attributs

Attribut : disabled

Permet de bloquer le menu déroulant.

Exemple

HTML
<form>
<select disabled="disabled">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>

Attribut : selected

Sélectionne le champs par défaut à utilisé.

Exemple

HTML
<form>
<select>
<option selected="selected">ipsum</option>
<option>dolor</option>
<option selected="selected">sit amet</option>
</select>
</form>

Attribut : mutiple

Permet de faire plusieurs sélections.

Exemple

HTML
<form>
<select multiple="multiple">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>

Attribut : size

Permet de définir le nombre d’option visible.

Exemple

HTML
<form>
<select size="2">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>

Attribut : tabindex

Permet de spécifier l’ordre de tabulation des liens, celui qui possède le plus petit chiffre sera tabulé en premier.

Exemple

HTML
<form>
<select tabindex="2">
<option>ipsum</option>
<option>dolor</option>
</select><br />
<select tabindex="1">
<option>Lorem</option>
<option>sit amet</option>
</select>
</form>

Attribut : class

Permet de spécifier la classe css à utiliser sur le menu.

Exemple

HTML
<form>
<select class="menu">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>
CSS
.menu{
background-color:chocolate;
}

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur le menu.

Exemple

HTML
<form>
<select id="menu">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>
CSS
#corps{
font-weight:bolder;
background-color:yellow;
}

Attribut : title

Permet de mettre une infobulle sur le menu.

Exemple

HTML
<form>
<select title="menu">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>

Attribut : dir

Permet de spécifier le sens d’écriture des textes du menu. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<form>
<select dir="rtl">
<option>أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, </option>
<option>معركة المدنيون بـ أخر.</option>
</select>
</form>

Attribut : style

Permet d’appliquer un style au corps directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<form>
<select style="font-style:italic; background-color:red;">
<option>ipsum</option>
<option>dolor</option>
<option>sit amet</option>
</select>
</form>

Attribut : lang

Permet de spécifier la langue du menu.

Exemple

HTML
I use :
<form>
<select lang="en">
<option>Windows</option>
<option>Linux</option>
<option>my hands</option>
</select>
</form>

I use :

HTML : textarea

L’ élément HTML textarea permet de créer une zone de saisie de texte dans un formulaire. Il est utilisé avec l’élément form pour créer le formulaire.

<form>
<textarea>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>

Attributs

Attribut : disabled

Permet de bloquer la zone de saisie.

Exemple

HTML
<form>
<textarea disabled="disabled">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>

Attribut : readonly

Change la zone de saisie, en zone d’affichage seulement.

Exemple

HTML
<form>
<textarea readonly="readonly">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>

Attribut : name

Permet de récuperer les données de la zone de saisie.

Exemple

HTML
<form>
<textarea name="texte">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>

Attribut : cols

Permet de changer la largeur de la zone de saisie.

Exemple

HTML
<form>
<textarea cols="50">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.</textarea>
</form>

Attribut : rows

Permet de changer la hauteur de la zone de saisie.

Exemple

HTML
<form>
<textarea rows="15">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.</textarea>
</form>

Attribut : class

Permet de spécifier la classe css à utiliser sur la zone de saisie .

Exemple

HTML
<form>
<textarea class="texte">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>
CSS
.texte{
background-color:chocolate;
}

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur la zone de saisie.

Exemple

HTML
<form>
<textarea id="texte">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>
CSS
#corps{
background-color:yellow;
}

Attribut : title

Permet de mettre une infobulle sur le corps de la page HTML.

Exemple

HTML
<form>
<textarea title="zone de saisie">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<form>
<textarea dir="rtl">أعلنت واندونيسيا،, الى حاملات الأمريكي، قد,</textarea>
</form>

Attribut : style

Permet d’appliquer un style à la zone de saisie directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<form>
<textarea style="background-color:grey">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</textarea>
</form>

Attribut : lang

Permet de spécifier la langue à l’intérieur de la zone de saisie.

Exemple

HTML
<form>
<textarea lang="en">
A person with Ubuntu is open and available to others, affirming of others, does not feel threatened that others are able and good, for he or she has a proper self-assurance that comes from knowing that he or she belongs in a greater whole and is diminished when others are humiliated or diminished, when others are tortured or oppressed.
</textarea>
</form>

HTML : table

L’ élément HTML de type block table permet de créer des tableaux.
Il est utilisé avec les éléments tr pour les lignes et td pour les colonnes.

<table>
<tr>
<td>Lorem ipsum dolor sit amet,</td>
<td>Suspendisse pharetra placerat felis</td>
<td>Mauris id nunc ac quam sollicitudin varius.</td>
</tr>
</table>

Attributs

Attribut : class

Permet de spécifier la classe css à utiliser sur le tableau.

Exemple

HTML
<table class="tableau">
<tr>
<td>Lorem ipsum dolor sit amet,</td>
<td>Suspendisse pharetra placerat felis</td>
<td>Mauris id nunc ac quam sollicitudin varius.</td>
</tr>
<tr>
<td>Mauris eget erat vitae purus lacinia egestas.</td>
<td>Proin nibh nisl, dictum vitae lacinia quis,</td>
<td>consectetur congue elit.</td>
</tr>
</table>
CSS
.tableau{
background-color:chocolate;
border:1px solid black;
}
.tableau tr td{
border:1px solid black;
}
Lorem ipsum dolor sit amet, Suspendisse pharetra placerat felis Mauris id nunc ac quam sollicitudin varius.
Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis,

consectetur congue elit.

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur le corps de la page HTML.

Exemple

HTML
<table id="tableau">
<tr>
<td>Lorem ipsum dolor sit amet,</td>
<td>Suspendisse pharetra placerat felis</td>
<td>Mauris id nunc ac quam sollicitudin varius.</td>
</tr>
<tr>
<td>Mauris eget erat vitae purus lacinia egestas.</td>
<td>Proin nibh nisl, dictum vitae lacinia quis,
<td>consectetur congue elit.</td>
</tr>
</table>
CSS
#tableau{
font-weight:bolder;
background-color:yellow;
border:1px solid black;
}
.tableau tr td{
border:1px solid black;
}
Lorem ipsum dolor sit amet, Suspendisse pharetra placerat felis Mauris id nunc ac quam sollicitudin varius.
Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis,

consectetur congue elit.

Attribut : title

Permet de mettre une infobulle sur le tableau.

Exemple

HTML
<table title="tableau">
<tr>
<td>Lorem ipsum dolor sit amet,</td>
<td>Suspendisse pharetra placerat felis</td>
<td>Mauris id nunc ac quam sollicitudin varius.</td>
</tr>
</table>
Lorem ipsum dolor sit amet, Suspendisse pharetra placerat felis Mauris id nunc ac quam sollicitudin varius.

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<table dir="rtl">
<tr>
<td> فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت</td>
<td>ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية.</td>
<td>الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.</td>
</tr>
</table>
فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.

Attribut : style

Permet d’appliquer un style au tableau directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<table style="border:1px solid black;">
<tr>
<td style="border:1px solid black;">Lorem ipsum dolor sit amet,</td>
<td style="border:1px solid black;">Suspendisse pharetra placerat felis</td>
<td style="border:1px solid black;">Mauris id nunc ac quam sollicitudin varius.</td>
</tr>
</table>
Lorem ipsum dolor sit amet, Suspendisse pharetra placerat felis Mauris id nunc ac quam sollicitudin varius.

Attribut : lang

Permet de spécifier la langue à l’intérieur du tableau.

Exemple

HTML
<table lang="en">
<tr>
<td>Where is Brian?</td>
<td>He is in the kitchen</td>
<td>He can't cook, what is he doing there?</td>
</tr>
</table>
Where is Brian? He is in the kitchen He can’t cook, what is he doing there?

HTML : h1-h6

Les éléments HTML de type inline h1 à h6 sont utilisés pour définir des titres. h1 définit le titre le plus important, h6 définit le titre le moins important. Ainsi par exemple h2 spécifie un titre moins important que h1 mais plus important que h3 et ainsi de suite.

<h1>Lorem ipsum dolor sit amet.</h1>

Attributs

Attribut : class

Permet de spécifier la classe css à utiliser sur le titre.

Exemple

HTML
<h1 class="titre">Lorem ipsum dolor sit amet.</h1>
CSS
.titre{
color:chocolate;
}

Lorem ipsum dolor sit amet.

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur le titre.

Exemple

HTML
<h2 id="titre">Lorem ipsum dolor sit amet.</h2>
CSS
#titre{
color:brown;
font-weight:bolder;
}

Lorem ipsum dolor sit amet.

Attribut : title

Permet de mettre une infobulle sur le titre.

Exemple

HTML
<h3 title="titre" >Lorem ipsum dolor sit amet.</h3>

Lorem ipsum dolor sit amet.

Attribut : dir

Permet de spécifier le sens d’écriture du titre. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<h4 dir="rtl" > فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت</h4>

فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت

Attribut : style

Permet d’appliquer un style au corps directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<h5 style="color:#FFCC33;font-style:italic;" >Lorem ipsum dolor sit amet.</h5>
Lorem ipsum dolor sit amet.

Attribut : lang

Permet de spécifier la langue du titre.

Exemple

HTML
<h6 lang="en">Open your windows to Ubuntu</h6>

Open your windows to Ubuntu

HTML : img

L’ élément HTML img permet d’insérer une image.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

Attributs

Attribut : src

Permet de spécifier l’url de l’image à rajouter.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

Attribut : height

Permet de spécifier la hauteur de l’image.
Elle est renseigné en pixel(px), point(pt), pourcentage(%), ou en em.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" height="50px" />

Attribut : width

Permet de spécifier la largeur de l’image.
Elle est renseigné en pixel(px), point(pt), pourcentage(%), ou en em.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" width="50px" />

Attribut : alt

Il permet d’afficher un texte alternatif par exemple lorsque des problèmes de chargement surviennent sur l’image.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png"  alt="logo php" />

logo php

Attribut : class

Permet de spécifier la classe css à utiliser sur l’image.

Exemple

HTML
<img class="image" src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />
CSS
.image{
border:5px solid chocolate;
}

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur l’image.

Exemple

HTML
<img id="image" src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />
CSS
#image{
border:5px solid yellow;
}

Attribut : title

Permet de mettre une infobulle sur le corps de la page HTML.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png"  title="logo php" />

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" dir="rlt" />

Attribut : style

Permet d’appliquer un style sur l’image directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<img style="border:5px solid black;" src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

Attribut : lang

Permet de spécifier la langue à l’intérieur de l’image.

Exemple

HTML
<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" lang="en" />

HTML : ol

L’ élément HTML olpermet de créer les listes ordonnées.
Il est utilisé avec l’élément HTML li pour chaque item de la liste.

<ol>
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ol>

Attributs

Attribut : class

Permet de spécifier la classe css à utiliser sur la liste.

Exemple

HTML
<ol class="liste">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ol>
CSS
.liste{
background-color:chocolate;
}
  1. Lorem ipsum dolor sit amet
  2. Suspendisse pharetra placerat felis
  3. Mauris id nunc ac quam sollicitudin varius.

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur la liste.

Exemple

HTML
<ol id="liste">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ol>
CSS
#line{
font-weight:bolder;
}
  1. Lorem ipsum dolor sit amet
  2. Suspendisse pharetra placerat felis
  3. Mauris id nunc ac quam sollicitudin varius.

Attribut : title

Permet de mettre une infobulle sur la liste.

Exemple

HTML
<ol title="liste non ordonnée">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ol>
  1. Lorem ipsum dolor sit amet
  2. Suspendisse pharetra placerat felis
  3. Mauris id nunc ac quam sollicitudin varius.

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<ol dir="rtl">
<li>قبل هو أهّل وبولندا. ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. جوزيف مدينة بريطانيا-فرنسا حدة في</li>
<li>فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.</li>
</ol>
  1. قبل هو أهّل وبولندا. ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. جوزيف مدينة بريطانيا-فرنسا حدة في
  2. فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.

Attribut : style

Permet d’appliquer un style à la liste directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<ol style="font-style:italic;color:chocolate;">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ol>
  1. Lorem ipsum dolor sit amet
  2. Suspendisse pharetra placerat felis
  3. Mauris id nunc ac quam sollicitudin varius.

Attribut : lang

Permet de spécifier la langue à l’intérieur de la liste.

Exemple

HTML
<ol lang="en">
<li>A person with Ubuntu is open and available to others</li>
<li>does not feel threatened that others are able and good</li>
<li>for he or she has a proper self-assurance</li>
</ol>
  1. A person with Ubuntu is open and available to others
  2. does not feel threatened that others are able and good
  3. for he or she has a proper self-assurance

HTML : ul

L’ élément HTML ulpermet de créer les listes non ordonnées.
Il est utilisé avec l’élément HTML li pour chaque item de la liste.

<ul>
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ul>

Attributs

Attribut : class

Permet de spécifier la classe css à utiliser sur la liste.

Exemple

HTML
<ul class="liste">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ul>
CSS
.liste{
background-color:chocolate;
}
  • Lorem ipsum dolor sit amet
  • Suspendisse pharetra placerat felis
  • Mauris id nunc ac quam sollicitudin varius.

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur la liste.

Exemple

HTML
<ul id="liste">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ul>
CSS
#line{
font-weight:bolder;
}
  • Lorem ipsum dolor sit amet
  • Suspendisse pharetra placerat felis
  • Mauris id nunc ac quam sollicitudin varius.

Attribut : title

Permet de mettre une infobulle sur la liste.

Exemple

HTML
<ul title="liste non ordonnée">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ul>
  • Lorem ipsum dolor sit amet
  • Suspendisse pharetra placerat felis
  • Mauris id nunc ac quam sollicitudin varius.

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<ul dir="rtl">
<li>قبل هو أهّل وبولندا. ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. جوزيف مدينة بريطانيا-فرنسا حدة في</li>
<li>فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.</li>
</ul>
  • قبل هو أهّل وبولندا. ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. جوزيف مدينة بريطانيا-فرنسا حدة في
  • فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.

Attribut : style

Permet d’appliquer un style à la liste directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<ul style="font-style:italic;color:chocolate;">
<li>Lorem ipsum dolor sit amet</li>
<li>Suspendisse pharetra placerat felis</li>
<li>Mauris id nunc ac quam sollicitudin varius.</li>
</ul>
  • Lorem ipsum dolor sit amet
  • Suspendisse pharetra placerat felis
  • Mauris id nunc ac quam sollicitudin varius.

Attribut : lang

Permet de spécifier la langue à l’intérieur de la liste.

Exemple

HTML
<ul lang="en">
<li>A person with Ubuntu is open and available to others</li>
<li>does not feel threatened that others are able and good</li>
<li>for he or she has a proper self-assurance</li>
</ul>
  • A person with Ubuntu is open and available to others
  • does not feel threatened that others are able and good
  • for he or she has a proper self-assurance

HTML : body

L’ élément HTML de type block body est le corps d’une page HTML. Il regroupe les éléments visibles par le visiteur, et n’est utilisable qu’une fois dans une page HTML.

<body>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</p>
</body>

Attributs

Attribut : class

Permet de spécifier la classe css à utiliser sur le corps de la page HTML.

Exemple

HTML
<body class="corps">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</body>
CSS
.corps{
background-color:chocolate;
}

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur le corps de la page HTML.

Exemple

HTML
<body id="corps">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</body>
CSS
#corps{
font-weight:bolder;
}

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.

Attribut : title

Permet de mettre une infobulle sur le corps de la page HTML.

Exemple

HTML
<body title="corps de la page">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</body>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<body dir="rtl">قبل هو أهّل وبولندا. ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. جوزيف مدينة بريطانيا-فرنسا حدة في, فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.</body>

قبل هو أهّل وبولندا. ويعزى الحروب مع دون, عام كل قررت تسمّى الشتوية. جوزيف مدينة بريطانيا-فرنسا حدة في, فصل وجهان واُسدل بمباركة بـ. بها عل أعلنت واندونيسيا،, الى حاملات الأمريكي، قد, معركة المدنيون بـ أخر.

Attribut : style

Permet d’appliquer un style au corps directement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<body style="font-style:italic;color:chocolate;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.
</body>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse pharetra placerat felis, quis auctor urna lobortis eu. Mauris id nunc ac quam sollicitudin varius. Mauris eget erat vitae purus lacinia egestas. Proin nibh nisl, dictum vitae lacinia quis, consectetur congue elit.

Attribut : lang

Permet de spécifier la langue à l’intérieur du corps de la page.

Exemple

HTML
<body lang="en">A person with Ubuntu is open and available to others, affirming of others, does not feel threatened that others are able and good, for he or she has a proper self-assurance that comes from knowing that he or she belongs in a greater whole and is diminished when others are humiliated or diminished, when others are tortured or oppressed.</body>

A person with Ubuntu is open and available to others, affirming of others, does not feel threatened that others are able and good, for he or she has a proper self-assurance that comes from knowing that he or she belongs in a greater whole and is diminished when others are humiliated or diminished, when others are tortured or oppressed.

HTML : a

L’ élément HTML de type inline a permet de définir un lien hypertexte vers un document en spécifiant l’url de ce document grâce à l’attribut href.
Il peut également définir des ancres au sein d’un document et définir les liens pour y accéder.

<a href ="http://www.web-petit.com">Accueil</a>

Attributs

Attribut : href

Permet de spécifier l’url de la cible.

Exemple

HTML
<a href="http://www.web-petit.com">Accueil</a>

Accueil

Attribut : tabindex

Permet de spécifier l’ordre de tabulation des liens, celui qui possède le plus petit chiffre sera tabulé en premier.

Exemple

HTML
<a href="http://www.web-petit.com" tabindex="3">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<a href="http://www.web-petit.com" tabindex="2">Suspendisse pharetra placerat felis,</a>
<a href="http://www.web-petit.com" tabindex="1">Mauris id nunc ac quam sollicitudin varius.</a>


Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Suspendisse pharetra placerat felis,
Mauris id nunc ac quam sollicitudin varius.

Attribut :href utilisé avec mailto

Permet aux visiteurs d’envoyer un mail à l’adresse indiquée dans le mailto.

Exemple

HTML
<a href="mailto:toto@domaine.com">Envoyer un mail</a>.

Envoyer un mail.

Attribut : hreflang

Permet de spécifier la langue utilisé dans le document de destination.

Exemple

HTML
<a href="http://www.web-petit.com" hreflang="fr">Accueil</a>

Accueil

Attribut : class

Permet de spécifier la classe css à utiliser sur la balise.

Exemple

HTML
<a class="Latin" href="http://www.web-petit.com" hreflang="fr">Accueil</a>
CSS
.Latin{
color:red;
}

Accueil

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur la balise.

Exemple

HTML
<a id="Latin" href="http://www.web-petit.com" hreflang="fr">Accueil</a>
CSS
#Latin{
color:black;
font-weight:bolder;
}

Accueil

Attribut : title

Permet de mettre une infobulle

Exemple

HTML
<a href="/" title="Lorem ipsum dolor sit amet">Accueil</a>

Accueil

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

Exemple

HTML
<a href="/" dir="rtl">شبكة</a>

Attribut : style

Permet d’appliquer un style au lien drectement dans le html, sans avoir besoin d’une feuille de style.

Exemple

HTML
<a href="/" style="font-style:italic;color:black;">Accueil</a>

Accueil

Attribut : lang

Permet de spécifier la langue à l’intérieur du lien.

Exemple

HTML
<a href="/" lang="en">Home</a>

Home

Firefox 4 Beta 4

Firefox Sync logoLe développement de Mozilla Firefox 4 continue et maintenant nous avons le droit à la quatrième Beta. Elle arrive donc avec son lot de nouveautés :

  • La Beta 4 est disponible en 39 langues.
  • Firefox Sync est maintenant inclus par défaut.
  • Panorama : une nouvelle fonctionnalité qui permet de voir tous les onglets ouverts, de le trier ou de les regrouper.
  • Plus d’animations JavaScript grâce à une nouvelle API expérimentale.
  • Support de l’attribut buffered de l’élément video HTML5.
  • etc…

Ah oui le etc c’est par ici.

Firefox Beta 4 Accueil

  1. Pages:
  2. 1
  3. 2
  4. 3
  5. 4
  6. 5
  7. 6
  8. 7
  9. ...
  10. 16