> 這里盡可能總結了你所遇到的樣式bug，歡迎大家補充完善。 [TOC] ### 去除瀏覽器或者手機自帶的樣式 Q:自帶元素的樣式，太丑了，想去掉 A:-webkit-appearance :none ; ### 頁面的高度得不到100% Q:頁面的高度得不到100% A:需要設置html，body的高度均為100% ~~~ html,body{ width:100%; height:100%; } ~~~ ### 輸入框內文字的光標顯示不統一的，有的為文字大小，有的為行高 Q:如題 A:設置padding:top=bottom ,模擬實現垂直居中的光標 ### cke-editor 在ie下不支持復制粘貼 Q:如題 A:打開IE，點擊“工具”菜單，選擇“兼容性視圖設置”，勾選“在兼容性視圖中顯示所有網站”選項即可。 ### input type=file 自定義樣式 Q:如題 A:通過絕對定位，覆蓋原來的樣式，并且用父標簽觸發事件，opacity: 0 ; /* 實現的關鍵點 */ filter:alpha(opacity= 0); /* 兼容IE */；其中js獲取文件相關信息： ~~~ onchange=uploadfile(this.value); var filestr=filename; var pos=filestr.lastIndexOf("\\"); filestr=filestr.substring(pos+1); ~~~ ### 輸入框的藍邊以及輸入提示的底色黃色 Q:如題 A:1 藍邊 ：outline:none ;2 黃底 ：input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset;} ### 輸入框的提示文字的顏色可以修改么 Q:如題 A: 代碼如下，顏色、行高、大小等都可以修改。`::-webkit-input-placeholder{}` ~~~ /* WebKit browsers */ ::-webkit-input-placeholder { color: #777; } /* Mozilla Firefox 4 to 18 */ :-moz-placeholder { color: #777; opacity: 1; } /* Mozilla Firefox 19+ */ ::-moz-placeholder { color: #777; opacity: 1; } /* Internet Explorer 10+ */ :-ms-input-placeholder { color: #777; } ~~~ ### 習慣性的寫最小高度，如何處理兼容問題？ Q:如題 A: 代碼如下，可以放心的使用，建議寫到混合函數mixin中。如果你不考慮低版本瀏覽器和ie，直接用min-height即可。 ~~~ /*最小高度兼容代碼*/ min-height: 500px; height:auto!important ; height: 500px; overflow: visible; ~~~ ### 文本域（textarea）右下角的可控區域是什么？如何去掉 Q:如題 A: resize: none; ### 英文以及數字不換行，導致超出顯示 Q:如題 A: word-break: break-all; 詳細的可以自己去了解。額外補充：white-space:nowrap ;不換行