您好,登錄后才能下訂單哦!
這篇文章將為大家詳細講解有關css中如何使用border-image-width屬性,文章內容質量較高,因此小編分享給大家做個參考,希望大家閱讀完這篇文章后對相關知識有一定的了解。
css border-image-width屬性用于指定圖像邊界的寬度,可以設置4個值(不可為負值),把邊框圖像分割為九個部分。它們代表了從區域的上、右、下、左側向內的距離。
css border-image-width屬性怎么用?
border-image-width屬性規定圖像邊框的寬度。
語法:
border-image-width: number|%|auto;
屬性值:
number:表示相應的border-width 的倍數
%:邊界圖像區域的大小:橫向偏移的寬度的面積,垂直偏移的高度的面積
auto:如果指定了,寬度是相應的image-slice的內在寬度或高度。
注釋:
border-image-width 屬性的的4個值指定用于把邊框圖像分割為九個部分。它們代表了從區域的上、右、下、左側向內的距離。
如果忽略第四個值,則與第二個值相同。如果省略第三個值,則與第一個值相同。如果省略第二個值,則與第一個值相同。不允許任何負值作為 border-image-width 值。
css border-image-width屬性 示例
<!DOCTYPE html><html><head><meta charset="UTF-8"><style>div {border: 30px solid transparent;border-image: url('https://cache.yisu.com/upload/information/20201210/269/44340.png');border-image-width: auto;border-image-repeat: round;border-image-slice: 30;}</style></head><body><div>DIV 使用圖像邊框</div><p>使用的圖片:</p><img src="https://cache.yisu.com/upload/information/20201210/269/44340.png"></body></html>
關于css中如何使用border-image-width屬性就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。