分享div加一個邊框樣式的範例程式碼

如何給div加一個邊框樣式？

對div盒子加一個邊框樣式很簡單只需要使用border板塊樣式即可。

一、虛線與實線邊框 - TOP

邊框虛線樣式：dashed
邊框實現樣式：solid

border:1px dashed #000

代表設定對象邊框寬度為1px黑色虛線邊框

border:1px solid #000

代表設定對象邊框寬度為1px黑色實現邊框

二、對div上邊加邊框 - TOP

我們給div上邊加1px黑色邊框

div{border-top:1px solid #000}

三、給div底部加邊框 - TOP

給div盒子底部加2px虛線紅色邊框

div{border-bottom:2px dashed #F00}

四、在div盒子左側加邊框 - TOP

給一個css選取器 css命名為“.divcss5”盒子左側加一個藍色1px實線邊框

.divcss5{ border-left:1px solid #00F}

DIV代碼：

<div class="divcss5">此DIV盒子左側為1px實線藍邊框</div>

五、在盒子div右側加邊框 - TOP

div對象右側加1px紅色實線邊框

div{ border-right:1px solid #F00}

六、在盒子上下加邊框 - TOP

給盒子上下加1px實現黑色邊框

div{border-top:1px solid #000;border-bottom:1px solid #000}

七、給div盒子左右加邊框 - TOP

給盒子左右加2px虛線綠色邊框

div{ border-left:2px dashed #0F0;border-right:2px dashed #0F0}

八、給div四邊加上一個邊框 - TOP

給一個DIV四邊加上3px實現黑色邊框

div{ border:3px solid #000}