<style>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das <style> SVG-Element ermöglicht es, Stylesheets direkt innerhalb von SVG-Inhalten einzubetten.

Hinweis: Das style-Element von SVG hat dieselben Attribute wie das entsprechende Element in HTML (siehe HTML-<style>-Element).

Beispiel

html
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
  <style>
    circle {
      fill: gold;
      stroke: maroon;
      stroke-width: 2px;
    }
  </style>

  <circle cx="5" cy="5" r="4" />
</svg>

Attribute

type

Dieses Attribut definiert den Typ der Stylesheetsprache, die als Medientyp-String verwendet werden soll. Werttyp: **``**; Standardwert: text/css; Animierbar: nein

media

Dieses Attribut definiert, auf welche Medien der Stil angewendet wird. Werttyp: <media-query-list>; Standardwert: all; Animierbar: nein

title

Dieses Attribut ist der Titel des Stylesheets, welcher zum Wechseln zwischen alternativen Stylesheets verwendet werden kann. Werttyp: <string>; Standardwert: keiner; Animierbar: nein

Verwendungskontext

KategorienKeine
Erlaubter InhaltBeliebige Elemente oder Zeichendaten

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# StyleElement

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
style
media
title
type

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch