【卜維丰】可以準備為框線加上圓角了

可以準備為框線加上圓角了

9/9 09'

圓角，是 CSS3 的規範。

基本語法是：

border-radius:5px;

5px 就是圓角的弧度了，但在正式發佈規範前，Gecko 系(FireFox、Flock)的瀏覽器，和 WebKit 系(Chrome、Safari)的瀏覽器，都俱備類似的語法：

-moz-border-radius:5px; -webkit-border-radius:5px;

所以，把三者都寫上

border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;

看起來像：

看不出效果的，看圖：

除此之外，邊框可以使用影像(border-image)，區塊可以加陰影(box-shadow)，文字加陰影(text-shadow)、底色半透明時，字再也不會跟著半透明(rgba)，這都是未來可期的視覺效果，就看瀏覽器開發的速度了！

準備迎接新世代 CSS3 吧！

同意轉載，不過麻煩看一下轉載需知

Fiona 2011/12/3 下午 08:18:00

謝謝分享~

January 2011/12/2 下午 04:55:00

I had no idea how to approach this before-now I'm lkcoed and loaded.

sean 2011/6/25 上午 01:43:00

這要CSS3才做的到

台灣還很普遍使用的IE8,都還在用CSS2
因此,IE的用戶仍然看不到

點點點 2009/11/10 上午 05:40:00

請問樓主中的文章框框怎麼辦到的
要怎樣把文章中的框框使用到有圓角框呢

彬 2009/10/11 下午 01:27:00

可以詳細教一下圓角怎用嗎?

給個回應

姓名:
佈落格網址:
	如果您是要發問問題, 最好有個問題測試的網址, 這樣比較容易找到您問題所在, 謝謝
內容: