CSS3的新屬性

2021-07-14 20:15:20 字數 525 閱讀 6635

1.線性漸變:

(linear 線性 gradient 漸變)

background-image:-webkit-linear-gradient(top,red 50%,yellow 50%,yellow90%)

2.徑向漸變:

(可以設定數值 百分比 英文)

background-image: -webkit-radial-gradient(30% 30%,red,white)

3.css倒影:(上above 下below 左left 右right)

-webkit-box-reflect:

below

0px-webkit-linear-gradient

(top, rgba(0,0,0,0) 10%,rgba(0,0,0,0.5) 90%);

注釋:第乙個值,倒影的方向

第二個值,倒影與內容之間的距離 

第三個值,漸變

4.text-shadow: p

p:hover

顏色可以重疊往上加

css3的新屬性陰影屬性

css3的新屬性陰影屬性 box shadow ie9 firefox 4 chrome opera 以及 safari 5.1.1 支援 box shadow 屬性。語法是 box shadow h shadow v shadow blur spread color inset box shado...

css3邊框新屬性

通過css3,可以建立圓角邊框 border radius 向矩形新增陰影 border shadow 甚至使用 border image 來繪製邊框。圓角邊框 div 取值 由浮點數字和單位識別符號組成的長度值。不可為負值。border top left radius 由浮點數字和單位識別符號組成...

css3新屬性學習

box size width 這樣就可以讓我們不必要再去計算盒子增減內邊距後有沒有撐開什麼的,因為無論內邊距如何變化,盒子的大小始終只會等於width。filter blur 5px 濾鏡,css3為我們增加了濾鏡效果,當括號中的數值越大,則越模糊。width calc 100 30px 可以自動計...