6. 不同瀏覽器用不同CSS

一、引入網頁檔
1.下載 jquery.js 以及 jquery.inc-5.pack.js，把這兩個檔放到和您的網頁同一目錄。接著，在您網頁的 </head> 前加入以下兩行：
<script type="text/javascript" src="jquery.js">
<script type="text/javascript" src="jquery.inc-5.pack.js">
2.在您的網頁，要插入檔案內容的地方，置入以下語法：
<div class="inc:欲引入檔案.html">備註文字</div>
3.您也可以作成互動式的即時產生內容：
<div onclick="$(this).inc('欲引入檔案.html');">秀在畫面的圖文</div>

二、分別設定IE、FireFox的外觀（FF在上，IE在下）
1.有些情況下，同一個CSS屬性，在不同瀏覽器中卻有不同的呈現外觀。為了讓各種瀏覽器都有相同外觀，我們可能需要針對各個瀏覽器來設定 CSS。以下是最簡單的設法（順序要對！#在下）：
color: red;   給FireFox用的，因為FF知道#是註解，故不執行下面一行。
#color: blue;   給IE用的，因為IE看不懂#，所以會傻傻的執行之。

2.另外也可以用「!important」，而「!important」必須先出現。
color: red !important;   給FireFox用的，因為FF知道!important要優先執行，故不管下面怎麼改都不會執行。
color: blue;   給IE用的，因為IE看不懂!important，所以還是會傻傻的執行之。

三、分別設定IE5、IE6、IE7、FireFox樣式
1.利用IE瀏覽器的專屬功能，可以針對瀏覽器版本不同，執行不同CSS
(1) <!--[if IE]>您用的是 IE 瀏覽器<![endif]-->
(2) <!--[if IE 5]>您用的是 IE 5.x 瀏覽器<![endif]-->
(3) <!--[if IE 5.5]>您用的是 IE 5.5 瀏覽器<![endif]-->
(4) <!--[if lt IE 6]>您用的是 IE < 6.0 瀏覽器<![endif]-->
(5) <!--[if gt IE 6]>您用的是 IE > 6.0 瀏覽器<![endif]-->
(6) <!--[if lte IE 5.5]>您用的是 IE <= 5.5 瀏覽器<![endif]-->

四、實戰：
1.請利用現有文章結構，搭配CSS，做一個空白的網頁樣板，方便日後套用。
2.沒有內容的時候，page區塊中的元件會超過page範圍，看起來不好看！如何讓他在沒有內容的時候，可以維持一定高度。而當有內容的時候，又不至於影響其外觀？

 

↓

3.提示：使用min-height屬性搭配height，min-height屬性只有FirFox有效，IE無效！如何讓IE也會有「最低高度」的效果？