專注Java教育14年
全國咨詢/投訴熱線：400-8080-105
更新時間：2022-08-18 10:30:04 來源：動力節(jié)點(diǎn) 瀏覽1812次
在HTML教程中，會講的很多知識，那么，在HTML中div邊框該如何設(shè)置？動力節(jié)點(diǎn)小編來告訴大家。在HTML前端斥地中，有數(shù)次會對配置邊框。這里給DIV加一個邊框方式教程，實(shí)現(xiàn)div邊框款式。經(jīng)由CSS border花樣屬性實(shí)現(xiàn)加邊框。如下是各類給DIV加分歧邊框?qū)嵗c才具教程、html代碼。
1.用到css單詞與值
border:1px solid #F00
設(shè)置對象邊框?yàn)榧t色邊框
2.div殘破小實(shí)例實(shí)例代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.CSS5.com.cn</title>
<style>
.a-4{ border:1px solid #F00}
</style>
</head>
<body>
<div class="a-4">四邊為血色</div>
</body>
</html>
1.運(yùn)用單詞和值
border-top:1px solid #F00
2.完整實(shí)例代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.CSS5.com.cn</title>
<style>
.a-top{ border-top:1px solid #F00}
</style>
</head>
<body>
<div class="a-top">只配置div上邊框</div>
</body>
</html>
1.應(yīng)用單詞和值
border-bottom:1px solid #000
2.殘破實(shí)例代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.CSS5.com.cn</title>
<style>
.a-bottom{ border-bottom:1px solid #000}
</style>
</head>
<body>
<div class="a-bottom">只設(shè)置div下邊框</div>
</body>
</html>
1.應(yīng)用單詞與值
border-left:1px solid #000
2.殘破源代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.CSS5.com.cn</title>
<style>
.a-left{ border-left:1px solid #000}
</style>
</head>
<body>
<div class="a-left">只設(shè)置div 左邊框</div>
</body>
</html>
1.DIV的右側(cè)框運(yùn)用單詞與值
border-right:1px dashed #F00
2.代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.CSS5.com.cn</title>
<style>
.a-right{border-right:3px dashed #F00}
</style>
</head>
<body>
<div class="a-right">只配置div右側(cè)邊框</div>
</body>
</html>
1.技能花樣先設(shè)置border值，即設(shè)置對象4邊均有邊框，那條div邊不需要設(shè)置裝備擺設(shè)邊框，就對其再配置邊框?yàn)?的值。
2.殘缺HTML源代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.CSS5.com.cn</title>
<style>
.a-san{border:3px solid #F00; border-bottom:0}
</style>
</head>
<body>
<div class="a-san">三邊有邊框，其它一邊沒有邊框</div>
</body>
</html>
配置下邊框沒有邊框，其它三邊設(shè)置邊框。——下邊框不設(shè)置裝備擺設(shè)邊框。
在下面實(shí)例代碼教程中，概略看到border的值中其中一個單詞為solid，即設(shè)置邊框格式為實(shí)體線。
常用的兼容各大瀏覽器的虛線為dashed 即實(shí)例代碼：
border:1px dashed #000
設(shè)置邊框1px虛線黑色邊框(#000 黑色采值，現(xiàn)實(shí)機(jī)關(guān)中精確色彩值依據(jù)貪圖圖經(jīng)由PS拾色器械取得)
即：
border:1px dashed #000 —— 虛線1px厚度寬度彩色邊框 border:1px solid #000 ——實(shí)線1px厚度寬度彩色邊框。
以上就是關(guān)于“HTML中div邊框設(shè)置方法”介紹，如果大家對此比較感興趣，想了解更多相關(guān)知識，可以關(guān)注一下動力節(jié)點(diǎn)的Java在線學(xué)習(xí)，里面的課程內(nèi)容從入門到精通，細(xì)致全面，比較適合沒有基礎(chǔ)的小伙伴學(xué)習(xí)，相信對大家一定會有所幫助的。
初級 202925
初級 203221
初級 202629
初級 203743
官方微信
官方抖音
Java實(shí)驗(yàn)班
Java就業(yè)班
Java夜校直播班
Java在職加薪班
Java架構(gòu)師班
京公網(wǎng)安備 11030102010736號