DOM樣式的border屬性用于設置或返回元素邊框的樣式。我們可以為各個側面(頂部，右側，底部，左側)設置不同的邊框樣式。 border-style屬性的每一側都可以采用多個值。

用法:

它用于返回Style屬性。object.style.borderStyle

它用于設置樣式屬性。object.style.borderStyle = value

DOM border-style屬性值

none:沒有創建邊框，并且將其保留為空白

hidden:就像“無”一樣，除非添加背景圖像，否則它不會顯示任何邊框，則border-top-width將被設置為0，與用戶定義的值無關。

dotted:一系列點顯示在一行中作為邊框。

solid:一條實線和粗線用作邊框。

dashed:一系列方形虛線用作邊框。

double:彼此平行放置的兩條線充當邊界。

groove:顯示3D溝槽邊框，其效果取決于border-color值。

ridge:顯示3D棱形邊框，其效果取決于border-color值。

inset:顯示3D嵌入邊框，其效果取決于border-color值。

起始：顯示3D起始邊框，其效果取決于border-color值。

返回值：它返回一個表示元素邊框樣式的字符串值。

示例1：

h1 {

color:green;

font-size:39px;

}

#GFG {

border:thick solid coral;

width:70%;

}

GeeksForGeeks

DOM Style border Property.

GeeksForGeeks.

A Computer Science Portal for geeks.

Submit

function myGeeks() {

// Return the style property.

document.getElementById("GFG").style.borderStyle =

"dashed dotted double solid";

}

輸出：

單擊按鈕之前：：

單擊按鈕后：

示例2：

h1 {

color:green;

font-size:39px;

}

#GFG {

width:70%;

}

GeeksForGeeks

DOM Style border Property.

GeeksForGeeks.

A Computer Science Portal for geeks.

Submit

function myGeeks() {

// Return the dotted style border.

document.getElementById("GFG").style.borderStyle =

"? dotted ";

}

輸出：

在單擊按鈕之前：

單擊按鈕后：

支持的瀏覽器：下面列出了DOM樣式border屬性支持的瀏覽器：

谷歌瀏覽器

IE瀏覽器

Firefox

Opera

Safari

總結

以上是生活随笔為你收集整理的html 代码 border,HTML Style border用法及代码示例的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。