The HTTP Content-Security-Policy
(CSP) style
-src-elem
directive specifies valid sources for stylesheets <style>
elements and <link>
elements with rel="stylesheet"
.
CSP version | 3 |
---|---|
Directive type | Fetch directive |
default-src fallback |
Yes. If this directive is absent, the user agent will look for the |
Syntax
One or more sources can be allowed for the style-src-elem
policy:
Content-Security-Policy: style-src-elem <source>; Content-Security-Policy: style-src-elem <source> <source>;
style-src-elem
can be used in conjunction with style-src
:
Content-Security-Policy:style
-src <source>; Content-Security-Policy:style
-src-elem <source>;
Sources
<source> can be one of the following:
- <host-source>
- Internet hosts by name or IP address, as well as an optional URL scheme and/or port number. The site's address may include an optional leading wildcard (the asterisk character,
'*'
), and you may use a wildcard (again,'*'
) as the port number, indicating that all legal ports are valid for the source.
Examples:http://*.example.com
: Matches all attempts to load from any subdomain of example.com using thehttp:
URL scheme.mail.example.com:443
: Matches all attempts to access port 443 on mail.example.com.https://store.example.com
: Matches all attempts to access store.example.com usinghttps:
.*.example.com
: Matches all attempts to load from any subdomain of example.com using the current protocol.
- <scheme-source>
- A scheme such as
http:
orhttps:
. The colon is required. Unlike other values below, single quotes shouldn't be used. You can also specify data schemes (not recommended).data:
Allowsdata:
URIs to be used as a content source. This is insecure; an attacker can also inject arbitrary data: URIs. Use this sparingly and definitely not for scripts.mediastream:
Allowsmediastream:
URIs to be used as a content source.blob:
Allowsblob:
URIs to be used as a content source.filesystem:
Allowsfilesystem:
URIs to be used as a content source.
'self'
- Refers to the origin from which the protected document is being served, including the same URL scheme and port number. You must include the single quotes. Some browsers specifically exclude
blob
andfilesystem
from source directives. Sites needing to allow these content types can specify them using the Data attribute. 'unsafe-eval'
- Allows the use of
eval()
and similar methods for creating code from strings. You must include the single quotes. 'unsafe-hashes'
- Allows enabling specific inline event handlers. If you only need to allow inline event handlers and not inline
<script>
elements orjavascript:
URLs, this is a safer method than using theunsafe-inline
expression. 'unsafe-inline'
- Allows the use of inline resources, such as inline
<script>
elements,javascript:
URLs, inline event handlers, and inline<style>
elements. The single quotes are required. 'none'
- Refers to the empty set; that is, no URLs match. The single quotes are required.
- 'nonce-<base64-value>'
- An allow-list for specific inline scripts using a cryptographic nonce (number used once). The server must generate a unique nonce value each time it transmits a policy. It is critical to provide an unguessable nonce, as bypassing a resource’s policy is otherwise trivial. See unsafe inline script for an example. Specifying nonce makes a modern browser ignore
'unsafe-inline'
which could still be set for older browsers without nonce support. - '<hash-algorithm>-<base64-value>'
- A sha256, sha384 or sha512 hash of scripts or styles. The use of this source consists of two portions separated by a dash: the encryption algorithm used to create the hash and the base64-encoded hash of the script or style. When generating the hash, don't include the <script> or <style> tags and note that capitalization and whitespace matter, including leading or trailing whitespace. See unsafe inline script for an example. In CSP 2.0, this applied only to inline scripts. CSP 3.0 allows it in the case of
script-src
for external scripts.
- 'report-sample'
- Requires a sample of the violating code to be included in the violation report.
Examples
TODO: add examples
Specifications
Specification | Status | Comment |
---|---|---|
Content Security Policy Level 3 The definition of 'style-src-elem' in that specification. |
Working Draft | Initial definition. |
Browser compatibility
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
style-src-elem | Chrome Full support 75 | Edge Full support 79 | Firefox
No support
No
| IE No support No | Opera Full support 62 | Safari No support No | WebView Android Full support 75 | Chrome Android Full support 75 | Firefox Android
No support
No
| Opera Android ? | Safari iOS No support No | Samsung Internet Android No support No |
Legend
- Full support
- Full support
- No support
- No support
- Compatibility unknown
- Compatibility unknown
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.
- See implementation notes.
- See implementation notes.