CSSImageValue

这是 实验性技术
检查 浏览器兼容性表格 在生产中使用这之前。

CSSImageValue interface of the CSS Typed Object Model API represents values for properties that take an image, for example background-image , list-style-image ,或 border-image-source CSSImageValue object represents an <image> that involves an URL, such as url() or image() , but not linear-gradient() or element() .

特性

None.

方法

None.

范例

We create an element

<button>Magic Wand</button>
					

We add some CSS, including a background image requesting a binary file:

button {
  display: inline-block;
  min-height: 100px; min-width: 100px;
  background: no-repeat 5% center url(https://mdn.mozillademos.org/files/16793/magicwand.png) aqua;
}
					

We get the element's style map. We then get() the background-image from the stylemap and stringify it:

// 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() );
					

规范

规范 状态 Comment
CSS Typed OM Level 1
The definition of 'CSSImageValue' in that specification.
工作草案 初始定义。

浏览器兼容性

更新 GitHub 上的兼容性数据
Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
CSSImageValue
Chrome 66 Edge 79 Firefox No IE No Opera 53 Safari No WebView Android 66 Chrome Android 66 Firefox Android No Opera Android 47 Safari iOS No Samsung Internet Android 9.0

图例

完整支持
完整支持
不支持
不支持
实验。期望将来行为有所改变。
实验。期望将来行为有所改变。

另请参阅

  1. CSSImageValue