㈠css3的新特性實際應用
⑴文本陰影效果，用代碼編寫的方式實現
⑵鼠標懸停的動態效果
左側三幅圖片，上面初始狀態是沒有說明文本的，但把鼠標放在上面的時候，這個圖片上面就出現了說明文字
⑶分欄分列式排版：類似於報刊的排版方式
⑷做一個盒子它的圓角邊框，還可以做一個盒子的陰影效果，若干個盒子的旋轉效果
㈡瀏覽器
w3c制定標准標准慢，瀏覽器廠商快速加入新屬性的支持，加前綴
w3c確定標准后，全面支持，去掉前綴
㈢圓角邊框 border-radius
Ⅰ.子屬性
⑴border-top-left-radius 左上角的形狀
⑵border-top-right-radius 右上角的形狀
⑶border-bottom-left-radius 左下角的形狀
⑷border-bottom-right-radius 右下角的形狀
Ⅱ圓角邊框的取值
⑴兩個值：一個是水平值，一個是垂直方向的值，也就是一個x值，一個y值
⑵一個值：水平方向和垂直方向上的值相等。
★我們以下圖為例來看一下怎樣添加的圓角。如果我們添加左上角，就是設置border-top-left-radius 的情況，那么水平方向和垂直方向的值確定下來，可以畫出來一個圓形或者橢圓形，用圓形或者橢圓形的這個弧形，就可以做出來一個圓角邊框的圓角了。
Ⅲ圓角邊框的示例
用div標簽寫出來的一個內容為空的盒子，現在只是顯示了這個圓角的邊框，這個時候我們可以用div標簽作為樣式的名字，然后進行設置高度，寬度，邊框，這個位置我們設置的是border-top-left這個圓角，它的角度設置為兩個值40和20個像素，意味着我們要在左上角做一個圓角，水平方向40px，垂直方向上20px，做出一個橢圓形，用這個橢圓形的左上角，來規定出來當前這個div盒子它的左上角的弧度。再看order-bottom-right-radius 這個值，在右下角做了一個圓形，規定水平方向和垂直方向都是20px，那么這個角是圓形，用這一部分來做一個右下角的一個弧度，這樣就可以完成如下圖所示的這樣一個盒子的設置。
Ⅳ.膠囊形狀的邊框的示例
⑴做一個div標簽的空盒子，規定它的樣式，高度，寬度，邊框，背景顏色。做了一個圓角，在做這個圓角的時候，並沒有規定是哪一個方向，直接使用border-radius來進行設置，而且只設置一個值25個像素；
⑵那么25px會呈現什么效果？因為高度是50px，25px真好是高度的一半，所以再添加圓角的時候，相當於上下左右四個角，它的水平方向和垂直方向都是25px，那么它會出現一個左右半圓的形狀。
⑶怎樣用這樣的屬性來做一個圓形？
可以像上面的例子一樣，只需要把它的高度和寬度定義成相同的。比如，做出來一個正方形的盒子，然后設置它的圓角的情況：border-radius的值是一個值，而且是這個高度的一半，這樣就做出來一個圓形
㈣陰影 box-shadow
inset 水平偏移 垂直偏移 模糊距離 顏色
⑴inset 可選的，內部陰影
⑵outset 默認值，外部陰影
具體效果圖如下：
代碼效果示例：
在這個例子里面做一個空的盒子，利用這個盒子來做一個它的陰影效果，設置高度，寬度，背景顏色，之后采用box-shadow來設置這個陰影部分，水平和垂直的偏移量都是正數，10px，由於是正數，則向右下角進行偏移，這個取值也可以都是負數，或者一正一負，組合，模糊范圍越大，就會發現陰影越大，范圍越小，陰影越小，灰色作為這個陰影效果的值。
希望有所幫助。