這篇文章主要介紹了如何設(shè)置div邊框的相關(guān)知識(shí)，內(nèi)容詳細(xì)易懂，操作簡(jiǎn)單快捷，具有一定借鑒價(jià)值，相信大家閱讀完這篇如何設(shè)置div邊框文章都會(huì)有所收獲，下面我們一起來(lái)看看吧。

設(shè)置裝備擺設(shè)div邊框border技倆

對(duì)div設(shè)置邊框CSS5給大家引見(jiàn)三種法子。

首先找到邊框CSS單詞：border

一、直接div標(biāo)簽內(nèi)設(shè)置邊框

1、div邊框?qū)嵗a

<divstyle="border:3pxsolid#F00">設(shè)置裝備擺設(shè)div邊框厚度3px，實(shí)線血色邊框</div>

2、成效截圖

3、注明直接對(duì)div標(biāo)簽內(nèi)使用style屬性并直接設(shè)置裝備擺設(shè)css邊框便可。

二、外部CSS對(duì)div設(shè)置裝備擺設(shè)邊框

1、CSS代碼

.exp{border:1pxdashed#00F}

2、HTML代碼

<divclass="exp">配置div邊框厚度1px，虛線藍(lán)色色邊框</div>

3、實(shí)例截圖

特別注明這里CSS代碼放HTML頁(yè)面內(nèi)，并使用style標(biāo)簽。若是是放入外部CSS文件，CSS代碼直接放CSS文件內(nèi)，就不需求style標(biāo)簽。

三、經(jīng)由過(guò)程div父級(jí)對(duì)其設(shè)置裝備擺設(shè)邊框花式

1、實(shí)例CSS代碼

.abcdiv{border:4pxsolid#090}

2、HTML代碼

<div>我在DIV內(nèi)然則不有邊框</div><div>我在DIV內(nèi)然而父級(jí)是class=abc所以我這個(gè)DIV有邊框</div><divclass="abc">我誠(chéng)然是在class=abc內(nèi)，然則我不有在此子級(jí)div內(nèi)</div></div><divclass="abc">

3、成就截圖

4、闡明從以上實(shí)例，一樣在div內(nèi)，因?yàn)閐iv父級(jí)不是.abc以是沒(méi)有邊框格式。因?yàn)閏lass=abc本身不有設(shè)置裝備擺設(shè)CSS邊框，只對(duì)class=abc子級(jí)div設(shè)置邊框，所以瞥見(jiàn)以上成就。

總結(jié)

以上是生活随笔為你收集整理的如何设置div边框的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。