CSSImageValue

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Die CSSImageValue-Schnittstelle der CSS Typed Object Model API repräsentiert Werte für Eigenschaften, die ein Bild erfordern, wie beispielsweise background-image, list-style-image oder border-image-source.

Das CSSImageValue-Objekt stellt ein <image> dar, das eine URL enthält, wie url() oder image(), jedoch nicht linear-gradient() oder element().

CSSStyleValue CSSImageValue

Instanzeigenschaften

Keine.

Instanzmethoden

Erbt Methoden von CSSStyleValue.

Beispiele

Wir erstellen ein Element

html
<button>Magic Wand</button>

Wir fügen einige CSS-Stile hinzu, einschließlich eines Hintergrundbildes, das eine Binärdatei anfordert:

css
button {
  display: inline-block;
  min-height: 100px;
  min-width: 100px;
  background: no-repeat 5% center url(magic-wand.png) aqua;
}

Wir erhalten die Stilkarte des Elements. Anschließend rufen wir das Hintergrundbild aus der Stilkarte ab und konvertieren es in einen String:

js
// get the element
const button = document.querySelector("button");

// Retrieve all computed styles with computedStyleMap()
const allComputedStyles = button.computedStyleMap();

// Return the CSSImageValue Example
console.log(allComputedStyles.get("background-image"));
console.log(allComputedStyles.get("background-image").toString());

Spezifikationen

Specification
CSS Typed OM Level 1
# imagevalue-objects

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch