您好,登錄后才能下訂單哦!
這篇文章主要介紹了html設(shè)置邊框的方法,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
html設(shè)置邊框的方法:1、通過“border-width”屬性設(shè)置邊框?qū)挾龋?、通過“border-style”屬性設(shè)置邊框樣式;3、通過“border-color”屬性邊框顏色。
HTML 為元素設(shè)置邊框
屬性:border,可以為元素這是上右下左四條邊框(順序很重要)
取值有三個:
1.border-width:邊框?qū)挾?,默認(rèn)3px,可以手動設(shè)置,取像素值
2.border-style:邊框樣式,必填項??扇。?solid (實線邊框) dashed(虛線邊框) dotted(點(diǎn)線邊框) double(雙線邊框)
3.border-color:邊框顏色,取顏色值,默認(rèn)黑色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style media="screen"> h2{ width:300px; height:150px; } .c1{ /*邊框?qū)挾扰c顏色有默認(rèn)值,樣式必須設(shè)置*/ border:solid; } .c2{ border:5px solid red; } .c3{ border:5px dashed green; } .c4{ border:5px dotted blue; } .c5{ border:5px double orange; } </style> </head> <body> <h2 class="c1"></h2> <h2 class="c2"></h2> <h2 class="c3"></h2> <h2 class="c4"></h2> <h2 class="c5"></h2> </body> </html>
效果如下:
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“html設(shè)置邊框的方法”這篇文章對大家有幫助,同時也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,更多相關(guān)知識等著你來學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。