讓我為大家介紹一下邊框樣式吧!如果大家想更進(jìn)一步了解邊框的使用,可以閱讀這一篇文章:CSS邊框border
屬性 | 描述 |
---|---|
none | 沒有邊框,即忽略所有邊框的寬度(默認(rèn)值) |
solid | 邊框?yàn)閱螌?shí)線 |
dashed | 邊框?yàn)樘摼€ |
dotted | 邊框?yàn)辄c(diǎn)線 |
double | 邊框?yàn)殡p實(shí)線 |
代碼演示:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
div {
float: left;
width: 200px;
height: 200px;
margin: 0 20px;
background-color: red;
text-align: center;
line-height: 200px;
font-size: 30px;
}
.box1 {
/* 沒有邊框 */
border: none;
}
.box2 {
/* 實(shí)線 */
border: 10px solid #000;
}
.box3 {
/* 虛線 */
border: 10px dashed #000;
}
.box4 {
/* 點(diǎn)線 */
border: 10px dotted #000;
}
.box5 {
/* 雙實(shí)線 */
border: 10px double #000;
}
</style>
</head>
<body>
<div class="box1">none</div>
<div class="box2">solid</div>
<div class="box3">dashed</div>
<div class="box4">dotted</div>
<div class="box5">double</div>
</body>
</html>
代碼效果:文章來源:http://www.zghlxwxcb.cn/news/detail-817397.html
感謝大家的閱讀,如有不對(duì)的地方,可以向我指出,感謝大家!文章來源地址http://www.zghlxwxcb.cn/news/detail-817397.html
到了這里,關(guān)于CSS之邊框樣式的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!