CSS是Cascading Style Sheets的縮寫,我們中文稱為「串聯樣式表」
CSS串聯樣式表教學『框線屬性一覽』
  • border-top : 1px solid #6699cc; /*上框線*/
  • border-bottom : 1px solid #6699cc; /*下框線*/
  • border-left : 1px solid #6699cc; /*左框線*/
  • border-right : 1px solid #6699cc; /*右框線*/

  • 以上是建議書寫方式,但也可以使用一般的方式 如下:
  • border-top-color : #369 /*設定上框線top色彩*/
  • border-top-width :1px /*設定上框線top寬度*/
  • border-top-style : solid/*設定上框線top樣式*/

  • 其他框線樣式
  • solid /*實線框*/
  • dotted /*虛線框*/
  • double /*雙線框*/
  • groove /*立體內凸框*/
  • ridge /*立體浮凸框*/
  • inset /*凹框*/
  • outset /*凸框*/
框線樣式運用範例
框線樣式簡說
border: 1px solid #6699cc;
邊框虛線效果就把solid的地方改為dotted
邊框線設粗一點就改變1px設為2px以上
邊框線色彩 #6699cc


框線樣式範例運用
<div style="border:2px dashed #690">這是一個綠色虛線框的區塊<div>




圖片邊框
img{border:0px;} /*刪除所有圖片邊框*/

框線樣式簡化寫法:
border:10px; /*四邊界一起宣告相同值*/
border:10pt 5pt 0pt 5pt;/*宣告四邊不同值順序為上、右、下、左*/
border: 1px solid #6699cc; /*宣告四邊同樣屬性*/
XHTML1.0 | CSS | Copyright © 2001-2008 by OECSPACE