1.模糊遮罩效率，模糊濾鏡效果
-webkit-filter: blur(3px);-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
2.漸變
background:-moz-linear-gradient(left,#ace,#f96);/*mozilla
*/background:-webkit-gradient(linear,0 50%,100% 50%,from(#ace),to(#f96));/*
old gradient for webkit
*/background:-webkit-linear-gradient(left,#ace,#f96);/*
new gradient for webkit
*/background:-o-linear-gradient(left,#ace,#f96); /*
opera11
*/
background: -moz-linear-gradient(, #ace, #f96);background: -webkit-gradient(,, from(#ace), to(#f96));//
老的寫法
background: -webkit-linear-gradient(, #ace, #f96);
background: -o-linear-gradient(, #ace, #f96);
.deg45
3.多行文字省略（相容性不好）
p
p p::after/*注意：
height高度正好是line-height的3倍；
結束的省略好用了半透明的png做了減淡的效果，或者設定背景顏色；
ie6-7不顯示content內容，所以要相容ie6-7可以是在內容中加入乙個標籤，比如用...去模擬；
要支援ie8，需要將::after替換成:after；
*/
4.彈性布局居中：在父級元素上面加上上面3句話，就可以實現子元素水平垂直居中。
justify-content:center;//子元素水平居中align-items:center;//子元素垂直居中
display:-webkit-flex;
5.給input placeholder 設定顏色
::-webkit-input-placeholder :-moz-placeholder ::-moz-placeholder :-ms-input-placeholder
6.**查詢
@media screen and (min-width:960px) and (max-width:1200px)}
7、如何修改chrome記住密碼後自動填充表單的黃色背景 ？
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill常用CSS效果
div水平居中margin 0px auto 在ie下可能不能正常顯示，原因dtd說明未正確使用 圍繞div內文字居中 lineheight的高度和div的高度相同 注意，文字不能換行 ie6 div內文字居中 多行文字居中顯示，使用display table cell vertical align...
常用的CSS動畫效果
在實際運用中，經常需要用到旋轉 放大等動畫效果。以下列舉了一些常見的動畫效果的css實現。所有的動畫都需要設定過渡transition rotateimg,scaleimg,rotateandscale,translateimg然後根據不同的動畫需要，修改css樣式 1 旋轉 rotateimg h...
css常用的布局效果
去掉 li 的點 list style none 絕對布局，定住導航欄 position fixed 生成絕對定位的元素，相對於瀏覽器視窗進行定位。top 0 z index 999 設定寬度包含 padding border content box sizing content box width...