CSS 原来可以这样写(三)
嗨小伙伴们基于 CSS 原来可以这样写(一),CSS 原来可以这样写(二)两篇文章,有木有感觉自己以前有些小问题的解决方案了?
有时候就是这样子,并不是特别大的问题但是确实很重要的。css的基础解决办法还是超级实用的吧!你不得不承认哦。这边文章继续吧。为你装逼增加一些砝码吧!(PS: 记住记住记住记住。装逼是需要砝码的。)
1. 取消chrome form表单的聚焦边框:
input,button,select,textarea{outline:none} textarea{resize:none}
2. 取消a链接的黄色边框:
a{-webkit-tap-highlight-color:rgba(0,0,0,0);}
3. 渐变
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ef6464, endColorstr= #eb4141);/*IE<9>*/ -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#ef6464, endColorstr=#eb4141)";/*IE8+*/
4.chrome字体缩小:
.chrome_adjust { font-size: 9px; -webkit-transform: scale(0.75); }
5. webkit 水平居中:
display:-webkit-box;-webkit-box-pack:center; -webkit-box-align: center;
6. 取消chrome 搜索x提示:
input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-results-button, input[type=search]::-webkit-search-results-decoration { display: none; }
7. autofill:
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset; } autocomplete="off"
8. 手机版本网页a标记虚线框问题
a:focus { outline:none; -moz-outline:none; }
9. 焦点去除背景:
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: transparent; // i.e. Nexus5/Chrome and Kindle Fire HD 7''
10. placeholder占位符颜色自定义
input:-moz-placeholder { color: #369; } ::-webkit-input-placeholder { color:#369; }