前端網站開發遇到的問題彙總

一、讓容器內文字無論是單行仍是多行始終垂直居中（兼容IE七、8）

解決：css沒法直接控制，用js實現

 

二、IE上超連接使用絕對定位後失效

解決辦法：
（1）使用position:relative而不是position:absolute；
（2）添加背景色；
（3）添加透明的背景圖片，gif或png，但會增長無心義的http請求；
（4）使用background:url(about:blank)，最佳方案。

 

三、IE6/7/8/9不支持placeholder的兩種解決辦法

（1）使用input的value做爲顯示文本

（2）不使用value，添加一個額外的標籤（span）到body裏而後絕對定位覆蓋到input上面

或者，也能夠用這種方式：

 

<input type="text" value="姓名" onfocus="if(value=='姓名') {value=''}" onblur="if (value=='') {value='姓名'}">

 

四、IE9如下瀏覽器不支持background-size屬性

三種解決方法：

（1）使用濾鏡，可是不能指定任意大小background百分比，要用絕對路徑的圖片；

（2）引入htc文檔，可指定百分比，相對路徑

（3）將圖片大小變化成實用大小。

 

 五、關於移動端字體問題

• 各個手機系統有本身的默認字體，且都不支持微軟雅黑
• 如無特殊需求，手機端無需定義中文字體，使用系統默認
• 英文字體和數字字體可以使用 Helvetica ，三種系統都支持

代碼：

/* 移動端定義字體的代碼 */
body{font-family:Helvetica;}

 

六、ie7下，a下的span手型指針消失的問題

這是ie7的一個bug，二種解決辦法：
（1）a標籤裏面文字連接不要用span包裹，用em或其餘標籤；
（2）給a標籤多加一個樣式：cursor: pointer;

 

七、IE7下不支持對block元素的inline-block

對元素設置 _zoom:1; *display:inline;便可