recursal/MDN huggingface dataset:
<wbr>
=====

L'élément HTML **`<wbr>`** permet de représenter un emplacement où casser la ligne si nécessaire. Le navigateur pourra alors utiliser cet emplacement pour effectuer un saut de ligne si le texte est trop long et qu'en temps normal, une règle empêche le saut de ligne.

Exemple interactif
------------------

Attributs
---------

Comme tous les autres éléments HTML, cet élément inclut les attributs universels.

Notes
-----

* Sur les pages encodées en UTF-8, `<wbr>` se comporte comme le point de code `U+200B ZERO-WIDTH SPACE`, il se comporte notamment comme un point de code Unicode bidi BN, ce qui signifie qu'il n'a aucun effet sur l'ordre bidirectionnel (cf. BiDi. Autrement dit : `<div dir=rtl>123,<wbr>456</div>` sera affiché comme `123,456` et non comme `456,123` lorsqu'il n'y a pas de saut de ligne.
* Pour la même raison, l'élément `< wbr >` n'introduit pas de trait d'union à la fin de ligne. Pour avoir ce caractère, il faudra utiliser l'entité (`& shy;`) (*soft-hyphen*).
* Cet élément a été initialement implémenté par Internet Explorer 5.5 et est défini officiellement dans la spécification HTML5.
Exemples
--------

### HTML


```html
<p>
  http://voici<wbr />.une<wbr />.très<wbr />.très<wbr />.longue<wbr />.URL<wbr />.com/avec<wbr />/pleins<wbr />/de<wbr />/niveaux<wbr />/de<wbr />/pages
</p>
```

### Résultat

**Note :** *Le guide stylistique de Yahoo* recommande de casser une URL avant la ponctuation afin d'éviter toute ambiguïté sur la fin de l'URL (l'utilisateur pourrait croire que l'URL se finit en fin de ligne alors qu'elle se poursuit plus loin).

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux,
 contenu phrasé.
  |
| Contenu autorisé | Aucun, cet élément est un élément vide. |
| Omission de balise | 
 Cet élément est un élément vide, il doit avoir une balise de début et ne
 doit pas avoir de balise de fin.
  |
| Parents autorisés | 
 Tout élément qui accepte du
 contenu phrasé.
  |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | `HTMLElement` |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-wbr-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `overflow-wrap`
* `word-break`
* `hyphens`
<blockquote> : l'élément de bloc de citation
============================================

L'élément HTML **`<blockquote>`** (qui signifie *bloc de citation*) indique que le texte contenu dans l'élément est une citation longue. Le texte est généralement affiché avec une indentation (voir les notes ci-après). Une URL indiquant la source de la citation peut être donnée grâce à l'attribut **`cite`** tandis qu'un texte représentant la source peut être donné via l'élément `<cite>`.

Exemple interactif
------------------

|  |  |
| --- | --- |
| Catégories de contenu | Contenu de flux,
 racine de section,
 contenu tangible.
  |
| Contenu autorisé | Contenu de flux. |
| Omission de balises | 
 Aucune, la balise d'ouverture et la balise de fermeture sont
 obligatoires.
  |
| Parents autorisés | 
 Tout élément acceptant du
 contenu de flux.
  |
| Rôle ARIA implicite | Pas de rôle correspondant |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | `HTMLQuoteElement` |

Attributs
---------

Comme pour tous les éléments HTML, on peut utiliser les attributs universels.

**`cite`**

Une URL qui désigne la source du document ou du message cité. Cet attribut est prévu pour signaler l'information expliquant le contexte ou la référence de la citation

Notes d'utilisation
-------------------

Pour changer l'indentation de `<blockquote>`, on utilisera la propriété CSS `margin-left` ou `margin-right` (ou encore la propriété raccourcie `margin`)

Pour les citations courtes, on pourra utiliser l'élément `<q>`.

Exemples
--------

Cet exemple démontre l'utilisation de l'élément `<blockquote>` pour citer un passage de RFC 1149 *A Standard for the Transmission of IP Datagrams on Avian Carriers*.


```html
<blockquote cite="https://datatracker.ietf.org/doc/html/rfc1149">
  <p>
    Avian carriers can provide high delay, low throughput, and low altitude
    service. The connection topology is limited to a single point-to-point path
    for each carrier, used with standard carriers, but many carriers can be used
    without significant interference with each other, outside of early spring.
    This is because of the 3D ether space available to the carriers, in contrast
    to the 1D ether used by IEEE802.3. The carriers have an intrinsic collision
    avoidance system, which increases availability.
  </p>
</blockquote>
```

### Résultat

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-blockquote-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `<q>` qui permet de placer des citations en incise dans une ligne de texte.
* `<cite>` qui permet d'indiquer la source de la citation.
<del> : l'élément de texte supprimé
===================================

L'élément HTML **`<del>`** représente une portion de texte ayant été supprimée d'un document. Cet élément est souvent (mais pas nécessairement) affiché rayé. L'élément `<ins>` est quant à lui utilisé pour représenter des portions de texte ajoutées.

Exemple interactif
------------------

Cet élément est souvent (mais pas nécessairement) rendu en appliquant un style barré au texte.

|  |  |
| --- | --- |
| Catégories de contenu | Contenu phrasé
 ou
 contenu de flux.
  |
| Contenu autorisé | Transparent. |
| Omission de balises | Aucune balise manquante n'est autorisée. |
| Parents autorisés | 
 Tout élément qui accepte du
 contenu phrasé.
  |
| Rôle ARIA implicite | Pas de rôle correspondant |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | `HTMLModElement` (en-US) |

Attributs
---------

Comme pour tous les autres éléments, on peut utiliser les attributs universels sur `<del>`.

`cite`

Une URL pour une ressource expliquant le changement (cela peut être un procès verbal d'une réunion par exemple).

`datetime`

Cet attribut indique l'heure et la date du changement et doit être une date valide avec une heure facultative. Si la valeur ne peut pas être analysée comme telle, l'élément n'aura pas d'information temporelle associée. Voir l'article sur les formats pour la représentation d'une date seule ou d'une date avec une heure.

Exemples
--------


```html
<p><del>Ce texte a été supprimé.</del> mais pas celui-ci</p>
```

### Résultat

Accessibilité
-------------

Par défaut, la plupart des outils d'assistance n'annoncent pas la présence de l'élément `del`. On peut le rendre annonçable via la propriété CSS `content` et grâce aux pseudo-éléments `::before` et `::after`.


```css
del::before,
del::after {
  clip-path: inset(100%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

del::before {
  content: " [Début de la suppression]";
}

del::after {
  content: " [Fin de la suppression] ";
}
```


Certaines personnes qui utilisent des lecteurs d'écran désactivent sciemment ces annonces pour éviter une verbosité trop importante. Il est donc important de ne pas abuser de cette technique et de ne l'appliquer qu'à des situations où il est nécessaire de comprendre que du contenu a été supprimé.

* Short note on making your mark (more accessible) | The Paciello Group (en anglais)
* Tweaking Text Level Styles | Adrian Roselli (en anglais)
Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-del-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'élément `<ins>` permet de représenter les insertions dans un texte
* L'élément `
` permet de représenter des portions de texte qui ne sont plus pertinentes (elles sont généralement barrées)
<rp> : l'élément de parenthèses alternatif aux annotations Ruby
===============================================================

L'élément HTML **`<rp>`** est utilisé pour fournir ce qui fera office de parenthèse aux navigateurs qui ne prennent pas en charge les annotations Ruby.

Les annotations Ruby permettent d'afficher la prononciation des caractères d'Asie orientale, notamment lors de l'usage de caractères furigana Japonais ou bopomofo Taïwanais.

Un élément `<rp>` devrait encadrer chaque parenthèse ouvrante et fermante englobant l'élément `<rt>` contenant les annotations.

Exemple interactif
------------------

Attributs
---------

Cet élément inclut uniquement les attributs universels.

Exemples
--------

### Avec prise en charge de ruby

#### HTML


```html
<ruby>
  漢 <rp>(</rp><rt>Kan</rt><rp>)</rp> 字 <rp>(</rp><rt>ji</rt><rp>)</rp>
</ruby>
```


```
body {
  font-size: 22px;
}
```


#### Résultat

### Sans prise en charge de ruby

Avec un navigateur ne prenant pas en charge les annotations Ruby, on aurait :
```

漢 (Kan) 字 (ji)
```


```
body {
  font-size: 22px;
}
```

Résumé technique
----------------

|  |  |
| --- | --- |
| Catégories de contenu | Aucune. |
| Contenu autorisé | Contenu phrasé. Texte. |
| Omission de balises | 
 La balise de fin peut être absente si l'élément est immédiatement suivi
 d'un élément `<rt>` ou d'un autre élément
 `<rp>` ou s'il n'y a plus de contenu dans l'élément
 parent.
  |
| Parents autorisés | 
 Un élément `<ruby>`. `<rp>` doit
 être positionné immédiatement avant ou après un élément
 `<rt>`.
  |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | `HTMLElement` |

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-rp-element |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `<ruby>`
* `<rt>`
* `<rb>`
* `<rtc>`
<nobr> : l'élément de non-rupture de texte (obsolète)
=====================================================

**Obsolète:** Cette fonctionnalité a été supprimée des standards du Web. Bien que quelques navigateurs puissent encore la supporter, elle est en cours d'éradication. Ne l'utilisez ni dans d'anciens projets, ni dans de nouveaux. Les pages et applications Web l'utilisant peuvent cesser de fonctionner à tout moment.

**Non standard:** Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

L'élément HTML **`<nobr>`** évite qu'un texte soit coupé par un retour à la ligne automatique ; il est donc affiché sur une seule ligne. Il peut être alors nécessaire d'utiliser les barres de défilement pour lire le texte en intégralité.

**Attention :** Cet élément n'est pas standard en HTML et ne doit donc pas être utilisé. **C'est la propriété CSS `white-space` doit être utilisée à la place**, de cette manière :


```html
<span style="white-space: nowrap">Un texte long sans retour à la ligne.</span>
```

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # nobr |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `white-space`
* `overflow`
theme-color
===========

La valeur de **`theme-color`** comme attribut `name` de l'élément `<meta>`, indique une suggestion de couleur que les agents utilisateur devraient utiliser pour personnaliser l'affichage de la page ou l'interface utilisateur environnante. Si elle est utilisée, l'attribut `content` devra avoir une valeur CSS de type `<color>`.

Exemple
-------


```html
<meta name="theme-color" content="#4285f4" />
```


L'image qui suit illustre l'effet de l'élément `<meta>` avec `theme-color` pour un document affiché dans Chrome sur Android.

![Image illustrant l'effet de theme-color](/fr/docs/Web/HTML/Element/meta/name/theme-color/theme-color.png)

*Crédits image : Couleurs des icônes et du navigateur, créée et partagée par Google et utilisée selon la licence Creative Commons 4.0 avec attribution.*

Il est possible de fournir un type de média ou une requête média avec l'attribut `media` afin que la couleur soit utilisée pour une condition donnée. Par exemple :


```html
<meta
 name="theme-color"
 media="(prefers-color-scheme: light)"
 content="white" />
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="black" />
```

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # meta-theme-color |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
<script> : attribut type
========================

L'attribut **`type`** de l'élément `<script>` indique le *type* de script représenté par l'élément : un script classique, un module JavaScript, une carte (*map*) d'import, ou un bloc de données.

Valeur
------

La valeur de cet attribut indique le type de données représenté par le script. La valeur pourra être :

Aucune valeur (l'attribut n'est pas défini), c'est le comportement par défaut. Ou une chaîne vide ou un type MIME JavaScript

La valeur indique que le script est un script « classique » qui contient du code JavaScript. Il est recommandé d'omettre l'attribut plutôt que de préciser un type MIME JavaScript si le script est un script JavaScript classique. Les types MIME JavaScript sont listés dans la spécification des types de média IANA.

`module`

La valeur indique que le code doit être traité comme un module JavaScript. Le traitement du contenu du script est différé et les attributs `charset` et `defer` n'ont pas d'effet. Pour plus d'informations sur l'utilisation de `module`, voir le guide sur les modules JavaScript. À la différence des scripts classiques, les scripts des modules doivent implémenter et respecter les règles CORS s'ils sont récupérés depuis une origine tierce.

`importmap`

La valeur indique que le contenu de l'élément contient une carte d'import (*import map*). Cette carte est un objet JSON que les développeuses et développeurs peuvent utiliser pour contrôler la façon dont le navigateur résout les spécificateurs de modules lors de l'import de modules JavaScript

Toute autre valeur

Le contenu embarqué est traité comme un bloc de données et ne sera pas traité par le navigateur. Afin d'indiquer des blocs de données, les développeuses et développeurs doivent utiliser un type MIME valide qui n'est pas un type MIME JavaScript. Tous les autres attributs seront ignorés, y compris l'attribut `src`.


**Note :** Dans les navigateurs antérieurs, le type identifiait le langage de script du code embarqué ou importé (à travers l'attribut `src`).

Spécifications
--------------

#### No specification found

No specification data found for `html.elements.script.type`.  
Check for problems with this page or contribute a missing `spec_url` to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
manifest
========

**Contexte sécurisé:** Cette fonctionnalité est uniquement disponible dans des contextes sécurisés (HTTPS), pour certains navigateurs qui la prennent en charge.

**Obsolète:** Cette fonctionnalité a été supprimée des standards du Web. Bien que quelques navigateurs puissent encore la supporter, elle est en cours d'éradication. Ne l'utilisez ni dans d'anciens projets, ni dans de nouveaux. Les pages et applications Web l'utilisant peuvent cesser de fonctionner à tout moment.

**Non standard:** Cette fonctionnalité n'est ni standard, ni en voie de standardisation. Ne l'utilisez pas pour des sites accessibles sur le Web : elle ne fonctionnera pas pour tout utilisateur. Il peut également y avoir d'importantes incompatibilités entre les implémentations et son comportement peut être modifié dans le futur.

L'attribut **`manifest`** de l'élément `<html>` indique une URL d'un manifeste de cache d'application à télécharger pendant les premières étapes du chargement de la page.

**Note :** La mise en cache utilisant un manifeste a été dépréciée. Les *service workers* doivent être utilisés à la place.

L'attribut `manifest` a un effet limité aux premières étapes de chargement de la page. Aussi, le modifier en JavaScript avec les interfaces du DOM usuelles n'aura pas d'effet, il faudra à la place utiliser l'interface `Window.applicationCache`.

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* `Window.applicationCache`
* L'API Service Worker
Attribut HTML : elementtiming
=============================

L'attribut **`elementtiming`** est utilisé pour indiquer qu'un élément est marqué pour le suivi par l'API Element Timing (en-US). Cet attribut peut être appliqué aux éléments `<img>`, `<image>` à l'intérieur d'un `<svg>`, aux vignettes des éléments `<video>`, aux éléments qui ont un `background-image` et aux éléments contenant des noeuds de texte, comme un paragraphe (`<p>)`.

Utilisation
-----------

La valeur donnée pour `elementtiming` devient un identifiant pour l'élément observé.


```html
<img alt="alt" src="img.jpg" elementtiming="étiquette pour l'élément" />
```


De bons candidats pour les éléments que vous pourriez vouloir observer sont :

* L'image principale d'un article.
* Le titre d'un article de blog.
* Les images dans un carrousel pour un site d'achat.
* L'image de l'affiche de la vidéo principale d'une page.
Exemples
--------


```html
<img alt="Alt pour l'image principale d'un article de blog"
 src="my-massive-image.jpg"
 elementtiming="Image principale">

<p elementtiming="important-text">Quelques informations importantes.</p">
```

Spécifications
--------------

{{Specifications}}Compatibilité des navigateurs
-----------------------------

{{Compat}}Voir aussi
----------

* Métriques personnalisées (en anglais)
Attribut HTML : capture
=======================

L'attribut **`capture`** spécifie que, facultativement, un nouveau fichier doit être capturé, et le périphérique qui devrait être utilisé pour capturer ce nouveau média d'un type défini par l'attribut `accept`. Les valeurs comprennent `user` et `environment`. L'attribut capture est pris en charge sur les champs de formulaire de type `file`.

L'attribut `capture` prend pour valeur une chaîne de caractères qui spécifie quelle caméra utiliser pour la capture des données d'image ou de vidéo, si l'attribut `accept` indique que l'entrée doit être de l'un de ces types.

| Valeur | Description |
| --- | --- |
| `user` | La caméra et/ou le microphone faisant face à l'utilisateur devraient être utilisés. |
| `environment` | La caméra et/ou le microphone orientés vers l'extérieur devraient être utilisés. |

**Note :** Capture était auparavant un attribut booléen qui, lorsqu'il était présent, indiqué que les périphériques de capture de l'appareil (comme la caméra ou le micro) devaient être utilisés plutôt que de demander à l'utilisateur de sélectionner un fichier.

Exemples
--------

Lorsqu'ils sont définis sur un type d'entrée de fichier, les systèmes d'exploitation dotés de microphones et de caméras affichent une interface utilisateur permettant la sélection à partir d'un fichier existant ou la création d'un nouveau fichier.


```html
<p>
  <label for="soundFile">Quel est le son de votre voix ?</label>
  <input type="file" id="soundFile" capture="user" accept="audio/\*" />
</p>
<p>
  <label for="videoFile">Téléchargez une vidéo :</label>
  <input type="file" id="videoFile" capture="environment" accept="video/\*" />
</p>
<p>
  <label for="imageFile">Téléchargez une photo de vous :</label>
  <input type="file" id="imageFile" capture="user" accept="image/\*" />
</p>
```


Notez que ceux-ci fonctionnent mieux sur les appareils mobiles ; si votre appareil est un ordinateur de bureau, vous obtiendrez probablement un sélecteur de fichiers classique.

Spécifications
--------------

| Specification |
| --- |
| HTML Media Capture # dfn-capture |

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* Utilisation de fichiers à partir d'applications web
* File API
* La propriété `HTMLInputElement.files`
Attribut HTML : maxlength
=========================

L'attribut **`maxlength`** définit le nombre maximal de caractères (en unités de code UTF-16) que l'utilisateur peut saisir dans un `<input>` ou un `<textarea>`. Il doit s'agir d'un nombre entier égal ou supérieur à 0. Si aucune longueur maximale n'est spécifiée, ou si une valeur non valide est spécifiée, l'entrée ou la zone de texte n'a pas de longueur maximale.

Toute valeur de `maxlength` doit être supérieure ou égale à la valeur de `minlength`, si elle est présente et valide. L'entrée échoue à la validation des contraintes si la longueur de la valeur textuelle du champ est supérieure à la longueur maximale des unités de code UTF-16. La validation des contraintes n'est appliquée que lorsque la valeur est modifiée par l'utilisateur.

### Validation des contraintes

Bien que le navigateur empêche généralement l'utilisateur de saisir plus de texte que ne l'autorise l'attribut `maxlength`, si la longueur est supérieure à ce dernier, la propriété en lecture seule `tooLong` (en-US) d'un objet `ValidityState` (en-US) sera vraie.

Exemple
-------


```html
<input type="password" maxlength="4" />
```

Spécifications
--------------

| Specification |
| --- |
| HTML Standard # the-maxlength-and-minlength-attributes |

Compatibilité des navigateurs
-----------------------------

### html.elements.input.maxlength

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### html.elements.textarea.maxlength

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Voir aussi
----------

* L'attribut `minlength`
* L'attribut `size`
* L'attribut `pattern`
* Validation des contraintes (en-US)
* L'API Constraint validation (en-US)
* L'élément `<input>`