iT邦幫忙

DAY 18
0

HTML5 & CSS3系列 第 18

30天分享(20) - CSS3 邊框樣式

  • 分享至 

  • xImage
  •  

CSS3 邊框多了圓角、陰影及邊框圖片,

讓我們來看看使用方法,至於產生的效果,

請大家貼以下的程式碼試試看 :

如要使用圓角 :

div {

border-radius: 25px;

}

想增加陰影 :

div {

box-shadow: 10px 10px 5px #888888;

}

值排列順序為 X、Y 軸偏移;陰影擴散及陰影顏色。

想要用圖片製作邊框 :

div {

border-image: url(border.png) 30 30 round;

}

圖片連結、切成幾片、多寬、重複樣式(stretch|repeat|round)


上一篇
30天分享(19) - CSS3 hack
下一篇
30天分享(21) - CSS3 背景
系列文
HTML5 & CSS328
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言