CSS3 border-image-slice 灞炴


瀹炰緥

鎸囧畾鍥惧儚鐨勮竟鐣屽悜鍐呭亸绉伙細

div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}

娴忚鍣ㄦ敮鎸

琛ㄦ牸涓殑鏁板瓧琛ㄧず鏀寔璇ュ睘鎬х殑绗竴涓祻瑙堝櫒鐗堟湰鍙枫

灞炴
border-image-slice 15.0 11.0 15.0 6.0 15.0

灞炴у畾涔夊強浣跨敤璇存槑

新快三讨论群—官方网址22270.COMborder-image -slice灞炴ф寚瀹氬浘鍍忕殑杈圭晫鍚戝唴鍋忕Щ銆

榛樿鍊: 100%
缁ф壙: no
鐗堟湰: CSS3
JavaScript 璇硶: object.style.borderImageSlice="50% 50%"


璇硶

border-image-slice: number|%|fill;

娉ㄦ剰: 姝ゅ睘鎬ф寚瀹氶《閮紝鍙筹紝搴曢儴锛屽乏杈圭紭鐨勫浘鍍忓悜鍐呭亸绉伙紝鍒嗕负涔濅釜鍖哄煙锛氬洓涓锛屽洓杈瑰拰涓棿銆傚浘鍍忎腑闂撮儴鍒嗗皢琚涪寮冿紙瀹屽叏閫忔槑鐨勫鐞嗭級锛岄櫎闈炲~鍐欏叧閿瓧銆傚鏋滅渷鐣ョ鍥涗釜鏁板瓧/鐧惧垎姣旓紝瀹冨拰绗簩涓浉鍚岀殑銆傚鏋滀篃鐪佺暐浜嗙涓変釜锛屽畠鍜岀涓涓槸鐩稿悓鐨勩傚鏋滀篃鐪佺暐浜嗙浜屼釜锛屽畠鍜岀涓涓槸鐩稿悓鐨勩

璇存槑
number 鏁板瓧琛ㄧず鍥惧儚鐨勫儚绱狅紙浣嶅浘鍥惧儚锛夋垨鍚戦噺鐨勫潗鏍囷紙濡傛灉鍥惧儚鏄煝閲忓浘鍍忥級
% 鐧惧垎姣斿浘鍍忕殑澶у皬鏄浉瀵圭殑锛氭按骞冲亸绉诲浘鍍忕殑瀹藉害锛屽瀭鐩村亸绉诲浘鍍忕殑楂樺害
fill 淇濈暀鍥惧儚鐨勪腑闂撮儴鍒