# style-src-attr (/fr/docs/web-security/policies/content-security-policy/directives/style-src-attr)



La directive `style-src-attr` d'une politique de sécurité du contenu (Content Security Policy, CSP) contrôle les attributs `style=` inline, c'est-à-dire le CSS écrit directement sur un élément comme `style="color:red"`. Elle ne couvre ni les feuilles de style ni les blocs `<style>` : ceux-ci relèvent de [`style-src-elem`](/fr/docs/web-security/policies/content-security-policy/directives/style-src-elem). Utilisez `style-src-attr` pour appliquer aux attributs de style inline une règle distincte, en général plus stricte.

Une politique minimale sûre pour cette directive, qui bloque tous les attributs `style=` inline :

```http
Content-Security-Policy: style-src-attr 'none'
```

## Chaîne de repli [#chaîne-de-repli]

`style-src-attr` se replie sur [`style-src`](/fr/docs/web-security/policies/content-security-policy/directives/style-src), puis sur [`default-src`](/fr/docs/web-security/policies/content-security-policy/directives/default-src). Si vous ne définissez pas `style-src-attr`, les attributs `style=` inline sont vérifiés contre `style-src`, et si elle est absente, contre `default-src`. Définir `style-src-attr` remplace `style-src` pour les attributs `style=` uniquement.

La plupart des politiques n'ont pas besoin de `style-src-attr`, puisque `style-src` couvre déjà les attributs `style=`. On la définit surtout pour bloquer complètement les attributs de style inline avec `'none'`, tout en continuant d'autoriser des feuilles de style via `style-src`.

## Valeurs [#valeurs]

`style-src-attr` accepte les mêmes types de valeurs que `style-src`, mais seules quelques-unes peuvent correspondre à un attribut `style=` inline.

| Valeur            | Statut   | Description                                                                                                  |
| ----------------- | -------- | ------------------------------------------------------------------------------------------------------------ |
| `'none'`          | ✅ Bon    | Bloque tous les attributs `style=` inline. S'utilise seule.                                                  |
| `'sha256-...'`    | ✅ Bon    | Empreinte du texte exact de l'attribut ; ne correspond qu'avec `'unsafe-hashes'`.                            |
| `'unsafe-hashes'` | ❌ Risqué | Permet aux hashes de correspondre aux attributs `style=` ; rouvre cette surface, à réserver à une migration. |
| `'report-sample'` | ✅ Bon    | Ajoute les 40 premiers caractères de l'attribut bloqué aux reports.                                          |
| `'unsafe-inline'` | ❌ Risqué | Autorise tous les attributs `style=`, y compris injectés.                                                    |

La grammaire accepte aussi `'self'` et des sources host, scheme et nonce, mais un attribut inline n'a aucune URL à leur opposer. En pratique, `style-src-attr` s'utilise avec un petit jeu de valeurs :

* `'none'` pour bloquer tous les attributs `style=` inline.
* `'unsafe-inline'` pour tous les autoriser (déconseillé).
* Un [hash](/fr/docs/web-security/policies/content-security-policy/values/csp-hashes-nonce) accompagné du mot-clé [`'unsafe-hashes'`](/fr/docs/web-security/policies/content-security-policy/values/csp-keywords), sans lequel un hash ne peut pas correspondre à un attribut `style=`.

Un nonce ne peut pas marquer un attribut. Les attributs `style=` inline s'autorisent donc par `'unsafe-inline'` ou par un hash plus `'unsafe-hashes'`, jamais par un nonce.

## Exemples [#exemples]

Bloquer tous les attributs de style inline tout en laissant les feuilles de style se charger normalement :

```http
Content-Security-Policy:
    style-src 'self' 'nonce-r4nd0m';
    style-src-attr 'none'
```

## Usage courant [#usage-courant]

`style-src-attr 'none'` est la cible à viser : elle ramène tout le style dans des feuilles de style et des blocs `<style>` marqués d'un nonce. Quand un template hérité pose quelques attributs `style=` statiques que vous ne pouvez pas encore retirer, hachez-les et ajoutez `'unsafe-hashes'`, puis planifiez leur migration. Le [générateur de hash](/tools/csp-hash) calcule l'empreinte et l'[évaluateur CSP](/tools/csp-evaluator) signale les règles faibles. Voir aussi le guide sur la [suppression de unsafe-inline](/fr/blog/unsafe-inline-csp).

## Notes de sécurité [#notes-de-sécurité]

Les attributs `style=` inline sont un vecteur d'injection CSS utilisé dans des recouvrements de phishing et l'exfiltration de données par sélecteurs. `style-src-attr 'none'` supprime ce vecteur.

* `'unsafe-inline'` autorise tous les attributs `style=`, y compris injectés : il annule donc la protection.
* `'unsafe-hashes'` se contente d'élargir la correspondance des hashes aux attributs `style=` (et aux event handlers inline). À lui seul, il n'autorise pas des blocs `<style>` inline entiers.

## Contournements et risques connus [#contournements-et-risques-connus]

Le risque principal est de laisser les attributs de style inline ouverts sans s'en rendre compte. Si `style-src-attr` n'est pas définie et que `style-src` (ou `default-src`) porte `'unsafe-inline'`, tous les attributs `style=` s'appliquent, même avec une règle serrée sur les feuilles de style. Définissez `style-src-attr 'none'` pour fermer cette brèche.

Un hash porte sur une chaîne figée : la moindre retouche du texte de l'attribut le casse. Traitez les attributs `style=` hachés comme une étape vers leur suppression, pas comme un état permanent.

## Recommandation [#recommandation]

Marquez d'un nonce ou d'un hash les styles que vous contrôlez sur `style-src`, et bloquez complètement les attributs `style=` inline :

```http
Content-Security-Policy:
    style-src 'self' 'nonce-{RANDOM}';
    style-src-attr 'none'
```

Le style reste ainsi dans des feuilles de style et des blocs `<style>` marqués d'un nonce, sans `'unsafe-inline'` nulle part. Si un attribut hérité ne peut pas encore bouger, hachez-le avec `'unsafe-hashes'` à titre temporaire et planifiez son retrait.

## Reporting [#reporting]

Un attribut de style inline bloqué produit un [report csp-violation](/fr/docs/web-security/reporting-api/reports/csp-violation) avec `style-src-attr` comme directive effective. Ajoutez `'report-sample'` pour inclure un court extrait et localiser l'attribut. CentralCSP agrège ces reports, de quoi trouver et retirer les attributs `style=` inline avant de resserrer la directive.

## Prise en charge par les navigateurs [#prise-en-charge-par-les-navigateurs]

Largement prise en charge par les navigateurs actuels.

## Voir aussi [#voir-aussi]

* [style-src](/fr/docs/web-security/policies/content-security-policy/directives/style-src)
* [style-src-elem](/fr/docs/web-security/policies/content-security-policy/directives/style-src-elem)
* [default-src](/fr/docs/web-security/policies/content-security-policy/directives/default-src)
* [Valeurs mots-clés CSP](/fr/docs/web-security/policies/content-security-policy/values/csp-keywords)
* [Générateur de hash](/tools/csp-hash)

## Sources [#sources]

* [MDN, CSP style-src-attr](https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Content-Security-Policy/style-src-attr)
* [W3C, Content Security Policy Level 3](https://www.w3.org/TR/CSP3/)