今天整理了一下我認為常用的一些css3 的效果，有靜態也有動畫，已整理成**。
doctype html
>
<
html
>
<
head
>
<
meta
charset
="utf-8"
>
<
title
>css3
title
>
<
link
rel="stylesheet"
href
="css/css3_css.css"
>
head
>
<
body
>
<
div
id="div1"
>1
div>
<
div
id="div2"
>2
div>
<
div
id="div3"
>3
div>
<
div
id="div4"
>4
div>
<
div
id="div5"
>5
div>
<
div
id="div6"
>6
div>
<
div
id="div7"
>7
div>
<
div
id="div8"
>8
div>
<
div
id="div9"
>9
div>
<
div
id="div10"
>10
div>
<
div
id="div11"
>11
div>
<
div
id="div12"
>12
div>
<
div
id="div13"
>13
div>
<
div
id="div14"
>14
div>
<
div
id="div15"
>15
div>
<
div
id="div16"
>16
div>
<
div
id="div17"
>17
div>
<
div
id="div18"
>18
div>
<
div
id="div19"
>19
div>
<
div
id="div20"
>20
div>
body
>
html
>
主要效果由css頁面實現，引入檔案css3_css.css：
/*css document
*//*
div的旋轉
*/div#div2
/*邊框與圓角的設定
*/#div3#div4
/*圓角：設左上角為①，順時針分別為②③④
*/#div5#div6#div7#div8#div9
/*另一種寫法
*/#div10#div11#div12#div13#div14#div15#div16#div17
/*更改後div的效果
*/#div17:hover#div18#div18:hover
/*div動畫
*/#div19@keyframes myfirst
/*當動畫進行到百分比進度的時候，背景顏色和位置發生變化
*/25% 50% 75% 100% }
常用CSS效果
div水平居中margin 0px auto 在ie下可能不能正常顯示，原因dtd說明未正確使用 圍繞div內文字居中 lineheight的高度和div的高度相同 注意，文字不能換行 ie6 div內文字居中 多行文字居中顯示，使用display table cell vertical align...
常用CSS3標籤及個性效果
1 圓角邊框 border radius 0.08rem moz border radius 0.08rem webkit border radius 0.08rem box sizing border box moz box sizing border box webkit box sizing ...
CSS常用動畫效果
1.標題兩邊的小橫槓 標題 title before after 2.滑鼠手型 cursor屬性 a href input type submit input type image input type button label for select,button 3.小三角 下 bottom 上 ...