【CSS筆記】網頁設計寫CSS常碰到的問題

7 月 10, 2015 | CSS, | 0 comments

關閉Chrome 12px字體大小限制

網頁設計時檢查遊覽器相容,發現設定12px以下字體,在goole chrome遊覽器卻都無效,上網查了一下結果,原來chrome遊覽器的預設限制最小字體為12px。
查詢了一下解決方法,就如下面的簡單語法,將chrome字體大小的限制關閉。

*PC桌面版的Chrome27正式取消了-webkit-文字大小調整屬性的支持,實際上是修正了原有的錯誤
 

-webkit-text-size-adjust:none;

 

令人頭痛的IE6 CSS解決方法

IE6 是一個讓人很頭痛過時且又多人用的遊覽器,每當為了找尋IE6 CSS相容問題,就花了不少時間。以下為幾個常用到的解決方法,方便您在做網頁設計可以快速有效率。

IE6 min-height CSS 解決方法

min-height: 300px;
_height:expression(this.scrollHeight < 300 ? "300px" : "auto");/*ie6支援min-height*/
_overflow:auto;/*ie6支援min-height*/

{googleads center}

CSS Hack-區別IE6、IE7、IE8、Firefox

【在CSS中使用辨識符號】:「9」、「*」、「_」
 


:root #csshack { color:pink /IE9; }  /* IE9  文字粉紅色*/

#csshack {

color:blue; /*Firefox 文字顏色藍色*/

color: green/IE8+9; /* IE8+9 文字顏色綠色* */

color:red 9; /*IE8 文字顏色紅色*/

*color:black; /*IE7 文字顏色黑色*/

_color:orange; /*IE6 文字顏色橘色*/

}

 

 

IE8 沒有hack only IE9有hack only

 

 

可以如下寫作,將原先ie8預設的樣式蓋過去。
 

.test {color:blue 9;   //ie8 hack} 
:root .test {color:red ; //ie9 only hack }

 

IE8 max-width CSS圖像變形的解決方法