[ CSS網頁裝潢學 ] CSS怎麼配合各家瀏覽器做微調?

2011-01-24

5872
0
2011-03-03

Technorati 的標籤：CSS,Web Design,Cross Browser

以FireFox跟IE比較padding、margin
FireFox: 設定padding時會影響width、height的寬、高度
IE:設定padding時不影響width、height的寬、高度

用法一 以FireFox為主製作，再對IE做微調
>:IE7以前的版本可以判讀
_ :IE6以前的版本可以判讀
>、-:FireFox兩者皆忽略
Example:順序要照範例所寫，不同會有錯誤

		 
		div {
		   width: 98px;/*設定在FF中的寬度*/
		   >width: 118px;/*設定在IE7中的寬度*/
		   _width: 118px;/*設定在IE6中的寬度*/
		   height: 98px;/*設定在FF中的高度*/
		   >height: 118px;/*設定在IE7中的高度*/
		   _height: 118px;/*設定在IE6中的高度*/
		   padding: 10px;
		   >padding-bottom: 4px;
		}
	

用法二 以FireFox為主製作，再對IE做微調
* +html:IE7可以判讀
* html:IE6以前的版本可以判讀
Example: 順序要照範例所寫，不同會有錯誤

		 
		test {width: 98px; height: 98px;}/*設定在FF中的寬高*/
		html #test {width: 98px; height: 98px;}/*設定在IE6中的寬高*/
		+html #test {width: 98px; height: 98px;}/*設定在IE7中的寬高*/
	

回首頁