css 中如何使用border-image-source屬性

發(fā)布時間：2021-07-26 13:44:58 來源：億速云閱讀：147 作者：Leah 欄目：開發(fā)技術(shù)

css 中如何使用border-image-source屬性，很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來學(xué)習(xí)下，希望你能有所收獲。

css border-image-source屬性用于指定要使用的圖像，從而替代border-style屬性中設(shè)置的邊框樣式。但當(dāng)屬性值為 "none"，或者如果圖像無法顯示時，則還需使用邊框樣式。

css border-image-source屬性怎么用？

border-image-source屬性規(guī)定要使用的圖像，從而替代border-style屬性中設(shè)置的邊框樣式。

語法：

border-image-source: none|image;

屬性值：

●　none：不使用圖像。

●　image：用作邊框的圖像的路徑，使用url()包含。

注釋：如果值為 "none"，或者如果圖像無法顯示，則使用邊框樣式。

css border-image-source屬性語法

<!DOCTYPE html><html><head><meta charset="UTF-8"><style> div {    border: 30px solid transparent;    width: 200px;    height: 50px;    border-image-source: url('https://cache.yisu.com/upload/information/20201210/269/44342.png');    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/44342.png"></body></html>

看完上述內(nèi)容是否對您有幫助呢？如果還想對相關(guān)知識有進一步的了解或閱讀更多相關(guān)文章，請關(guān)注億速云行業(yè)資訊頻道，感謝您對億速云的支持。

向AI問一下細(xì)節(jié)

css 中如何使用border-image-source屬性

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽