返回列表 發帖

Box Model 設計-邊框(三)

本帖最後由 陳育霖 於 2023-8-29 10:46 編輯

圖片邊框 border-image
border-image-source: 圖片URL
border-slice: 長度|百分比
四個值:上、右、下、左
三個值:上、左右、下
兩個值:上下、左右
一個值:上下左右
  1. #box_image{
  2.     margin: 50px;
  3.     padding: 10px;
  4.     border: 50px solid;
  5.     border-image-source: url(borderfig.png);
  6.     border-image-slice: 50;
  7. }
複製代碼
圖片寬度 border-image-width: 百分比|數值|auto
圖片邊框長度 border-image-outset: 百分比|數值
  1. #box_image{
  2.     margin: 50px;
  3.     padding: 10px;
  4.     border: 50px solid;
  5.     border-image-width:
  6.     border-image-source: url(borderfig.png);
  7.     border-image-width: 100px;
  8.     border-image-outset: 30px;
  9. }
複製代碼
附件: 您需要登錄才可以下載或查看附件。沒有帳號?註冊

返回列表