Computer: Makeuper: CSS: Step07: Difference between revisions

From TestingMediawiki
Jump to navigation Jump to search
Line 31: Line 31:
## 駭客
## 駭客
## 視障人士
## 視障人士
## 聽障人士
# 純文字瀏覽器要假設其不支援以下數種功能
# 純文字瀏覽器要假設其不支援以下數種功能
## CSS 樣式表
## CSS 樣式表

Revision as of 05:24, 16 February 2005

回到 Computer ‧ 回到 Computer: Makeuper
回到 Computer: Makeuper: CSS

各瀏覽器對 CSS 的支援度

  1. IE 6 families: CSS 1 全部、CSS 2 非常少
  2. IE 7 families: 還沒出不清楚
  3. Gecko families(Mozilla, Firefox...): 隨時支援絕大多數新出的開放規格及標準
  4. Opera: 隨時支援絕大多數新出的開放規格及標準
  5. lynx: 不明
  6. links2: 不支援
  7. 其它純文字瀏覽器: 不明

如何解決不同瀏覽器的支援度不同的問題

  1. 使用子類別的方式來處理
    1. 只能用在外部的 CSS 檔案及 HTML 文件 head 處的 style 宣告而已。
    2. 寫法 :

      * > TAG { attribute : value ; }

    3. 解說

      「*」是萬用字元,可用來代表任何的 HTML 標籤。

      「>」就是子類別的表示法, IE 6 看不懂所以使用這個時,以下的樣式指定就會被它所忽略掉。

  2. 使用 Javascript 來辯識瀏覽器的版本
  3. 使用內嵌 IE7 Favelet 的 js 檔案來處理。
    1. http://dean.edwards.name/IE7/favelet.html
    2. 在文件中放入以下 JavaScript 語法以使 IE 使用該檔,而其它瀏覽器不使用。(檔案位置請自行調整)
      <!--[if it IE7]>
      <script type="text/javascript" src="ie7.js"></script>
      <[endif]-->

如何寫一個純文字瀏覽器也能正常觀看的網頁

  1. 使用 lynx viewer 你可以看看你的網頁用 lynx 的顯示結果
  2. 什麼人要用到純文字瀏覽器?
    1. 講究效率的人
    2. 只關心你網頁的文字資料而不想看你的網頁多美觀的人
    3. 駭客
    4. 視障人士
    5. 聽障人士
  3. 純文字瀏覽器要假設其不支援以下數種功能
    1. CSS 樣式表
    2. JavaScript
    3. Java
    4. 圖片、音樂等多媒體格式檔案
  4. 在 Firefox 1.0 中可以這麼做來模擬純文字瀏覽器
    1. 關閉 css : 在「檢視 → 樣式表」中選「不使用樣式表」
    2. 關閉 JavaScript : 在「工具 → 選項 → 網頁」中把 javascript 關閉掉
    3. 關閉 Java : 在「工具 → 選項 → 網頁」中把 Java 關閉掉
    4. 關閉圖片 : 在「工具 → 選項 → 網頁」中把顯示圖片關閉掉
  5. Firefox 可以裝 Web Developer 來方便模擬
    1. 關閉 css : Disable - Disable Styles
    2. 關閉 JavaScript : Disable - Disable JavaScript
    3. 關閉 Java : Disable - Disable Java
    4. 關閉圖片 : Disable - Disable Images
  6. 其它補充:如果你的網頁在關閉以上功能後會慘不忍睹的話,最好重新編排一下網頁的結構。
    1. 多多利用 h 標題文字來分出大段落來
    2. 多多利用 p 來分出小段落來
    3. 利用 | 將同一列的超連結分隔開來
    4. 利用 hr 來分隔開不同主題區域
    5. 利用純文字瀏覽器不支援 CSS 這點,在標籤中加入 style="display:none;" 來隱藏不想在支援 CSS 的瀏覽器中出現的元素。