css中常見(jiàn)的邊框樣式是什么

發(fā)布時(shí)間：2020-12-07 12:36:26 來(lái)源：億速云閱讀：200 作者：小新欄目：web開(kāi)發(fā)

這篇文章主要介紹了css中常見(jiàn)的邊框樣式是什么，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

多樣的邊框樣式，可以豐富我們網(wǎng)頁(yè)的界面，提高用戶體驗(yàn)。css邊框樣式，常見(jiàn)的有實(shí)線、虛線、雙線、點(diǎn)線等等一些邊框樣式。

代碼如下：

<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
    <title></title>
    <style type="text/css">
        h2{width: 500px;}
        h2.abc {border-style: none;}
        h2.dotted {border-style: dotted;}
        h2.dashed {border-style: dashed;}
        h2.solid {border-style: solid;}
        h2.double {border-style: double;}
        h2.groove {border-style: groove;}
        h2.ridge {border-style: ridge;}
        h2.inset {border-style: inset;}
        h2.outset {border-style: outset;}
        h2.hidden {border-style: hidden;}
    </style>

</head>
<body>
<h2 class="none">無(wú)邊框</h2>
<h2 class="dotted">點(diǎn)狀邊框</h2>
<h2 class="dashed">虛線邊框</h2>
<h2 class="solid">實(shí)線邊框</h2>
<h2 class="double">雙線邊框</h2>
<h2 class="groove">3D 凹槽邊框</h2>
<h2 class="ridge">3D 壟狀邊框</h2>
<h2 class="inset">3D inset 邊框</h2>
<h2 class="outset">3D outset 邊框</h2>
<h2 class="hidden">隱藏邊框</h2>
</body>
</html>

邊框樣式如下：

css中常見(jiàn)的邊框樣式是什么

border-style 屬性用于設(shè)置元素所有邊框的樣式，或者單獨(dú)地為各邊設(shè)置邊框樣式。

注：只有當(dāng)這個(gè)值不是 none 時(shí)邊框才可能出現(xiàn)。

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享css中常見(jiàn)的邊框樣式是什么內(nèi)容對(duì)大家有幫助，同時(shí)也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問(wèn)題就找億速云，詳細(xì)的解決方法等著你來(lái)學(xué)習(xí)!

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

css中常見(jiàn)的邊框樣式是什么

猜你喜歡

最新資訊

相關(guān)推薦

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