?
This document uses PHP Chinese website manual Release
border-image-source:none | <image>
默認(rèn)值:none
適用于:所有元素,除table元素設(shè)置了 <' border-collapse '> 為collapse之外
繼承性:無
動(dòng)畫性:否
計(jì)算值:指定值
none:無背景圖片。
<image>:使用絕對(duì)或相對(duì)地址指或者創(chuàng)建漸變色來確定圖像。
指定一個(gè)圖像用來替代 <' border-style '> 邊框樣式的屬性。當(dāng) <' border-image '> 為none
或圖像不可見時(shí),將會(huì)顯示 <' border-style '> 所定義的邊框樣式效果。
對(duì)應(yīng)的腳本特性為borderImageSource。
Values | IE | Firefox | Chrome | Safari | Opera | iOS Safari | Android Browser | Android Chrome |
---|---|---|---|---|---|---|---|---|
Basic Support | 6.0-10.0 | 2.0-3.0 | 4.0-14.0 -webkit- | 3.1-5.1 -webkit- | 15.0+ | 3.2-5.1 -webkit- | 2.1-4.3 -webkit- | 18.0+ |
11.0+ | 3.5-14.0 -moz- | 15.0 -webkit- | 6.0+ | 6.1+ | 4.4-4.4.4 | |||
15.0+ | 16.0+ |
<!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8" /> <title>border-image-source_CSS參考手冊(cè)_web前端開發(fā)參考手冊(cè)系列</title> <meta name="author" content="Joy Du(飄零霧雨), dooyoe@gmail.com, www.doyoe.com" /> <style> .test { padding: 10px; border-image-source: url(skin/border.png); border-image-slice: 27; border-image-width: 27px; } </style> </head> <body> <div class="test">用圖片來做邊框</div> </body> </html>
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例