網頁頁面里使用 inline-block 元素時經常需要隱藏其文字,
比較流行的方法是將 line-height 的值設置得很大,
然后配合 overflow: hidden 來隱藏文字。
請容許我主觀臆斷地認為過大的行高會影響渲染效率,
而行高不夠又可能在用戶對頁面進行放大操作時露出“馬腳”(即未能被隱藏的部分)。
是否當 line-height:0 時對 Webkit 內核就沒有辦法了?
我想到利用透明文字來解決這一兼容問題,
并最終整理如下:
font-size:0; /* for firefox & opera */ color: transparent; /* for webkit */ line-height:0; overflow:hidden; /* for IE */
上面是第一種方法,下面說第二種方法
display:block; line-height:0px; text-indent:-9999px; overflow:hidden;
自測后兼容的瀏覽器如下:
IE 6-8
Firefox 1-4
Opera 9-10
Safari 3-5
Chrome 1-6
Copyright@ 2011-2016 版權所有:大連千億科技有限公司 遼ICP備11013762-3號 google網站地圖 百度網站地圖 網站地圖
公司地址:大連市沙河口區中山路692號辰熙星海國際2317 客服電話:0411-39943997 QQ:2088827823 37482752
法律聲明:未經許可,任何模仿本站模板、轉載本站內容等行為者,本站保留追究其法律責任的權利! 隱私權政策聲明