CSS3 入門到精通（一）

標籤：logs   chrome   float   布局   tle   tab   pre   int   bsp   

CSS 用於控制網頁的樣式和布局。

CSS3 是最新的 CSS 標準。

一. CSS3邊框

執行個體

向 div 元素添加圓角：

div{border:2px solid;border-radius:25px;-moz-border-radius:25px; /* Old Firefox */}

CSS3 邊框陰影

在 CSS3 中，box-shadow 用於向方框添加陰影：

 

執行個體

向 div 元素添加方框陰影：

div{box-shadow: 10px 10px 5px #888888;}　

CSS3 邊框圖片

通過 CSS3 的 border-image 屬性，您可以使用圖片來建立邊框：

border-image 屬性允許您規定用於邊框的圖片！

用於建立上面的邊框的原始圖片：

執行個體

使用圖片建立圍繞 div 元素的邊框：

div{border-image:url(border.png) 30 30 round;-moz-border-image:url(border.png) 30 30 round; /* 老的 Firefox */-webkit-border-image:url(border.png) 30 30 round; /* Safari 和 Chrome */-o-border-image:url(border.png) 30 30 round; /* Opera */}

　

屬性	描述	CSS
border-image	設定所有 border-image-* 屬性的簡寫屬性。	3
border-radius	設定所有四個 border-*-radius 屬性的簡寫屬性。	3
box-shadow	向方框添加一個或多個陰影。	3

CSS3 入門到精通（一）