在 CSS 中，設置元素的邊框圖像拉伸方式可以通過 `border-image-slice`、`border-image-width`、`border-image-outset` 和 `border-image-repeat` 這幾個屬性來實現(xiàn)。

`border-image-slice` 屬性用于指定邊框圖像的切片區(qū)域，它接受四個值，分別表示上、右、下、左四個方向的切片位置。例如，`border-image-slice: 30 30 30 30` 表示將邊框圖像在四個方向上都切成 30 像素的切片。如果只指定一個值，那么這個值將被應用于所有四個方向；如果指定兩個值，那么第一個值將被應用于上、下方向，第二個值將被應用于左、右方向；如果指定三個值，那么第一個值將被應用于上方向，第二個值將被應用于左、右方向，第三個值將被應用于下方向；如果指定四個值，那么這四個值將分別被應用于上、右、下、左四個方向。

`border-image-width` 屬性用于指定邊框圖像的寬度，可以是一個具體的像素值，也可以是一個百分比值。如果指定一個像素值，那么邊框圖像的寬度將是這個像素值；如果指定一個百分比值，那么邊框圖像的寬度將是父元素寬度的這個百分比。

`border-image-outset` 屬性用于指定邊框圖像超出邊框的距離，可以是一個具體的像素值，也可以是一個百分比值。如果指定一個像素值，那么邊框圖像將超出邊框這個像素值；如果指定一個百分比值，那么邊框圖像將超出邊框這個百分比的父元素寬度。

`border-image-repeat` 屬性用于指定邊框圖像的重復方式，可以是 `repeat`（重復）、`round`（平鋪）或 `stretch`（拉伸）。`repeat` 表示邊框圖像將在水平和垂直方向上重復；`round` 表示邊框圖像將在水平和垂直方向上平鋪，并且如果圖像不能完全平鋪，將會自動調整大小；`stretch` 表示邊框圖像將在水平和垂直方向上拉伸，以適應邊框的大小。

以下是一個示例代碼，演示如何設置元素的邊框圖像拉伸方式：

```css

.box {

border: 20px solid transparent;

border-image: url(border-image.png) 30 30 30 30 stretch;

}

```

在上面的代碼中，`border` 屬性設置了一個透明的邊框，`border-image` 屬性指定了邊框圖像的路徑為 `border-image.png`，切片位置為 30 像素，重復方式為 `stretch`。這樣，邊框圖像將被拉伸以適應邊框的大小。

需要注意的是，`border-image` 屬性是 CSS3 中的新屬性，并不是所有的瀏覽器都支持。在使用 `border-image` 屬性時，需要確保瀏覽器支持該屬性，或者使用 `-webkit-border-image`（用于 WebKit 瀏覽器）、`-moz-border-image`（用于 Firefox 瀏覽器）等私有屬性進行兼容處理。

通過 `border-image-slice`、`border-image-width`、`border-image-outset` 和 `border-image-repeat` 這幾個屬性的組合使用，可以靈活地設置元素的邊框圖像拉伸方式，從而實現(xiàn)各種不同的效果。在實際應用中，可以根據(jù)需要選擇合適的屬性和值，以達到最佳的效果。