元素的邊框 (border) 是圍繞元素內容和內邊距的一條或多條線。
css border 屬性允許你規定元素邊框的樣式、寬度和顏色。
css 邊框
通過使用 css 邊框屬性，我們可以建立出效果出色的邊框，並且可以應用於任何元素。
每個邊框有 3 種屬性：寬度、樣式，以及顏色。
css 邊框與背景
css 規範指出，邊框繪製在"元素的背景之上"。這很重要，因為有些邊框是"間斷的"（例如，點線邊框或虛線框），元素的背景應當出現在邊框的可見部分之間。
css 邊框的樣式
css 的 border-style 屬性 定義了邊框的樣式，包括 none。
css 定義多種樣式
您可以為乙個邊框定義多個樣式，例如：
p.aside上面這條規則為類名為 aside 的段落定義了四種邊框樣式：實在線邊框、點線右邊框、虛線下邊框和乙個雙線左邊框。這裡的值採用了 top-right-bottom-left 的順序。
邊框樣式值如下：
none :無邊框。與任何指定的border-width值無關
hidden :隱藏邊框。ie不支援
dotted :在mac平台上ie4+與windows和unix平台上ie5.5+為點線。否則為實線（常用）
dashed :在mac平台上ie4+與windows和unix平台上ie5.5+為虛線。否則為實線（常用）
solid :實線邊框（常用）
double :雙線邊框。兩條單線與其間隔的和等於指定的border-width值
groove :根據border-color的值畫3d凹槽
ridge :根據border-color的值畫菱形邊框
inset :根據border-color的值畫3d凹邊
outset :根據border-color的值畫3d凸邊
css 定義單邊樣式
如果您希望為元素框的某乙個邊設定邊框樣式，而不是設定所有 4 個邊的邊框樣式，可以使用下面的單邊邊框樣式屬性：border-top-style、border-right-style、border-bottom-style、border-left-style
因此這兩種方法是等價的：
p注意：如果要使用第二種方法，必須把單邊屬性放在簡寫屬性之後。因為如果把單邊屬性放在 border-style 之前，簡寫屬性的值就會覆蓋單邊值 none。p
css 邊框的寬度
您可以通過 border-width 屬性為邊框指定寬度。
為邊框指定寬度有兩種方法：可以指定長度值，比如 2px 或 0.1em；或者使用 3 個關鍵字之一，它們分別是 thin 、medium（預設值） 和 thick。
注釋：css 沒有定義 3 個關鍵字的具體寬度，所以乙個使用者**可能把 thin 、medium 和 thick 分別設定為等於 5px、3px 和 2px，而另乙個使用者**則分別設定為 3px、2px 和 1px。
所以，我們可以這樣設定邊框的寬度：
p或者：
pcss 定義單邊寬度
您可以按照 top-right-bottom-left 的順序設定元素的各邊邊框：
p上面的例子也可以簡寫為（這樣寫法稱為值複製）：
p您也可以通過下列屬性分別設定邊框各邊的寬度：border-top-width、border-right-width、border-bottom-width、border-left-width
因此，下面的規則與上面的例子是等價的：
pcss 邊框的顏色
設定邊框顏色非常簡單。css 使用乙個簡單的 border-color 屬性，它一次可以接受最多 4 個顏色值。
可以使用任何型別的顏色值，例如可以是命名顏色，也可以是十六進製制和 rgb 值：
p如果顏色值小於 4 個，值複製就會起作用。例如下面的規則宣告了段落的上下邊框是藍色，左右邊框是紅色：
p注釋：預設的邊框顏色是元素本身的前景色。如果沒有為邊框宣告顏色，它將與元素的文字顏色相同。另一方面，如果元素沒有任何文字，假設它是乙個**，其中只包含影象，那麼該錶的邊框顏色就是其父元素的文字顏色（因為 color 可以繼承）。這個父元素很可能是 body、div 或另乙個 table。
css 定義單邊顏色
還有一些單邊邊框顏色屬性。它們的原理與單邊樣式和寬度屬性相同：border-top-color、border-right-color、border-bottom-color、border-left-color
要為 h1 元素指定實線黑色邊框，而右邊框為實線紅色，可以這樣指定：
h1css 沒有邊框
在前面的例子中，您已經看到，如果希望顯示某種邊框，就必須設定邊框樣式，比如 solid 或 outset。
那麼如果把 border-style 設定為 none 會出現什麼情況：
p儘管邊框的寬度是 50px，但是邊框樣式設定為 none。在這種情況下，不僅邊框的樣式沒有了，其寬度也會變成 0。邊框消失了，為什麼呢？
這是因為如果邊框樣式為 none，即邊框根本不存在，那麼邊框就不可能有寬度，因此邊框寬度自動設定為 0，而不論您原先定義的是什麼。
記住這一點非常重要。事實上，忘記宣告邊框樣式是乙個常犯的錯誤。根據以下規則，所有 h1 元素都不會有任何邊框，更不用說 20 畫素寬了：
h1由於 border-style 的預設值是 none，如果沒有宣告樣式，就相當於 border-style: none。因此，如果您希望邊框出現，就必須宣告乙個邊框樣式。
三邊有邊而一邊沒有設定技巧：
如左右下有邊框並且樣式為黑色1px寬度實線邊框，而上邊沒有邊框。
css **： border:1px solid #000; border-top:none;
css 透明邊框
如果邊框沒有樣式，就沒有寬度。不過有些情況下您可能希望建立乙個不可見的邊框。css2 引入了邊框顏色值 transparent。這個值用於建立有寬度的不可見邊框。
使用方法：border-color: transparent;
從某種意義上說，利用 transparent，使用邊框就像是額外的內邊距一樣；此外還有乙個好處，就是能在你需要的時候使其可見。這種透明邊框相當於內邊距，因為元素的背景會延伸到邊框區域（如果有可見背景的話）。
重要事項：在 ie7 之前，ie/win 沒有提供對 transparent 的支援。在以前的版本，ie 會根據元素的 color 值來設定邊框顏色。
html css基礎教程入門之CSS 尺寸
css 尺寸 dimension 屬性允許你控制元素的高度和寬度。同樣，它允許你增加行間距。css height 屬性 height 屬性用以設定元素的高度，單位可以使用px，em等，通常用使用px 畫素 為html單位。這個屬性定義元素內容區的高度，在內容區外面可以增加內邊距 邊框和外邊距。設定段...
CSS 基礎教程
1簡介 1 css 概述 1.1css 指層疊樣式表 1.2內容與表現分離 2 多重樣式將層疊為乙個 2.1優先權 2.1.1內聯樣式 在 html 元素內部 2.1.2內部樣式表 位於 head 標籤內部 2.1.3外部樣式表 2.1.4瀏覽器預設設定 2基礎語法 1 語法 1.1由兩個主要的部分...
QWT基礎教程之legends
效果預覽 工程目錄樹如下 headers mainwindow.h panel.h plot.h settings.h sources main.cpp mainwindow.cpp panel.cpp plot.cpp 這裡一共有4個.件，4個.c檔案，涉及到4個主要類 mainwindow pa...