HTML中的边框属性
生活随笔
收集整理的這篇文章主要介紹了
HTML中的边框属性
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
可以通過邊框風格屬性border-style設定上下左右邊框的風格，該屬性用于設置一個元素邊框的樣式，而且必須用于指定可見的邊框。可以使用1到4個關鍵字，如果四個值都給出了，它們分別用于上、右、下和左邊框的樣式
如果給出一個值，它將被運用到各邊上。
如果兩個或三個值給出了，省略了的值與對邊相等
也可以分別使用border-top-style、border-bottom-style、border-left-style、border-right-style屬性單獨設置各邊的風格
各邊的風格使用的屬性值
none：沒有邊框，無論邊框寬度設置為多大
dotted：點線式邊框
dashed：破折線式邊框
solid：直線式邊框
double：雙線式邊框
groove：槽線式邊框
ridge：脊線式邊框
inset：內嵌效果的邊框
outset：突起效果的邊框
1 <!--
2 可以通過邊框風格屬性border-style設定上下左右邊框的風格，該屬性用于設置一個元素邊框的樣式，而且必須用于指定可見的邊框。可以使用1到4個關鍵字，如果四個值都給出了，它們分別用于上、右、下和左邊框的樣式
3
4 如果給出一個值，它將被運用到各邊上。
5
6 如果兩個或三個值給出了，省略了的值與對邊相等
7
8 也可以分別使用border-top-style、border-bottom-style、border-left-style、border-right-style屬性單獨設置各邊的風格
9
10
11 各邊的風格使用的屬性值
12 none：沒有邊框，無論邊框寬度設置為多大
13 dotted：點線式邊框
14 dashed：破折線式邊框
15 solid：直線式邊框
16 double：雙線式邊框
17 groove：槽線式邊框
18 ridge：脊線式邊框
19 inset：內嵌效果的邊框
20 outset：突起效果的邊框
21 -->
22 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
23 <html xmlns="http://www.w3.org/1999/xhtml">
24 <head>
25 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
26 <title>邊框風格屬性</title>
27 <style>
28 h1{
29 border-style:solid;
30 border-width:10px 20px 30px 40px;
31 border-color:red blue yellow green;
32 }
33 h2{
34 border-style:double solid inset dotted;
35 }
36 h3{
37 border-top-style:solid;
38 border-bottom-style:outset;
39 }
40 </style>
41 </head>
42
43 <body>
44 <h1>wwwwwwwwwwwwwwwww</h1>
45 <h2>wwwwwwwwwwwwwwwww</h2>
46 <h3>wwwwwwwwwwwwwwwww</h3>
47 </body>
48 </html>
總結
以上是生活随笔為你收集整理的HTML中的边框属性的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 王者荣耀6字好听的名字89个
- 下一篇： 花枝片是什么食材