MozTW 討論區

各項 Mozilla 相關軟體與技術討論
現在的時間是 2026-01-27, 15:28

所有顯示的時間為 UTC + 8 小時





發表新文章 回覆主題  [ 46 篇文章 ]  前往頁數 上一頁  1234
發表人 內容
文章發表於 : 2005-05-08, 05:45 
離線
[MozTW 版主群]
頭像

註冊時間: 2003-09-15, 03:47
文章: 1016
來自: Taiwan
Yahoo KB 的問題如何能讓firefox遊覽器羺支援html得語法啊

引言回覆:
HTML 一般都不是問題(也有例外)。通常在顯示或功能上的問題來自於格式表 (stylesheet, CSS) 與 JavaScript 腳本語言用法不正確或不符標準。

如果語法錯誤,通常瀏覽器會「猜測」設計者的心思來顯示內容。但每個瀏覽器的行為都不同。而有些設計人往往編碼隨便,以為只要 IE 顯示正確他的原始碼就一定對,忽視了其它瀏覽器可能會有不同解釋。

而語法不符標準往往是因為設計者用了微軟專有的技術,而不是通用的標準。技術相容問題起源於 90 年代微軟與網景 (Netscape) 在爭奪市場時各打自己的技術,迫使設計師要學些奇怪的技巧讓網頁可以正確顯示。時代已過,這些瀏覽器(IE4 與 Netscape 4)加起來使用率只剩 <1%,而取而代之的 Firefox、Opera、IE 5.5+ 等都支援通用的資訊網標準。可惜的是,舊習慣從過去設計師或從未更新的教學資源散播到新一代設計師,使得許多網站還是照舊 90 年但現代已不適用的技術/技巧。

然而,甚麼是標準?誰定的?一般而言我們所指的標準是由全球資訊網協會 (W3C) 所定的 HTML 4.01、CSS 樣示、與 DOM (文件物件模型) 的技術規格書。W3C 是個與許多專家和公司(包括微軟)合作訂立與推行資訊網技術的組織。

在來講 HTML 與 CSS。我說 HTML 不是問題是因為在新的標準 (HTML 4.01) 中它只處理文件架構,與文件格式完全分開 (格式由 CSS 處理)。現在的 HTML 已沒有如 <font>、bgcolor、color 等排版格式的元素/屬性,只有如 <p> (段落)、<h1> (標題)、<address> (作者)、<li> (列表)等「語意」元素。(如果你現在用的教學站/書有教你用<font> 或 bgcolor 那你可以把它丟了)。

說來說去還是不懂,那舉個例子吧

過去你可能這樣寫:
代碼:
<b><font color="red">警告</font></b>
  (粗體)(字體 顏色=紅色)紅字((*字體)(*粗體)


但現在你要用
代碼:
<strong style="color:red;">警告</strong>
(重強調 樣式="顏色:紅色")警告(*重強調)


沒甚麼不同,不過如果你要用好幾個這類格式呢?
代碼:
<head>
<style type="text/css">
strong { color: red; }
</strong>
</head>
:
<strong>警告</strong>
哇,太方便了,你只需要定義樣示一次就可以重覆用了

再一個範例:
代碼:
<head>
<style type="text/css">
.date { color: red; } /* 日期,紅字 */
.title { background-color: blue; color: white; } /* 標題,白字籃底 */
.username { font-style:italic; } /* 用戶名,斜體 */
</strong>
</head>
:
<table>
<tr><td class="title">我有問題</td><td class="username">珊珊</td><td class="date">10/10/99</td></tr>
:
</table>
哇,也可以這樣用呀。那如果要改格式呢?那改 <style></style> 內的東西「一次就夠了」!

還有呢,你可以把 <style></style> 內的東西放到一個文字檔(舉例叫 mystyle.css) 然後用
代碼:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>


「老師,那是不是要改整個網站的格示只要改一個檔就好了?」
「對,注意你編碼不是寫越多就分數越多 oh。」

那我前面說過,HTML 與格式分開,那一些標籤(像 <strong>、<h1>)不本身就有預設格式?對也不對,舉例來說

代碼:
<style type="text/css">
ul.snav li { display: inline; } /* 包括在 <ul class="snav"> 的 <li> 都是以文字層顯示 */
</style>
:
<ul class="snav">
<!-- 以下全顯示在一行文字內 -->
<li><a>隱私權政策</a></li>
<li><a>服務條款</a></li>
<li><a>使用規範</a></li>
</ul>


(忘了說,以上這些觀念都是利用 CSS)

除了可以把任何元素設為文字層、區塊層、或表格的顯示模式 (display mode) 外,CSS 還可以:
  • 設定背景圖片的位置與是否橫向或縱向重複
  • 設定文字底線與頂線
  • 設定各種元素的上下左右框格的顏色、線條、與粗細
  • 字行與字行間,或段落與段落間的空格
  • 隨意置放文字在任何地方(不用表格)
  • 還有好多好多的進階功能

不過呢,除了學那些可以做甚麼外,還要學正確的設計觀念。要注意,你樣式越複雜出錯的機率就越高。你編碼寫的越亂,除錯就越困難,花的時間就越多。雖然 HTML 與 CSS 功能強,但它們基礎在於文件架構的邏輯,而你在設計時越有 discipline (紀律)越能發揮這些技術的潛能。

(抱歉沒能有時間解釋 JavaScript 與 DOM)


回頂端
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414
 個人資料  
引用回覆  
顯示文章 :  排序  
發表新文章 回覆主題  [ 46 篇文章 ]  前往頁數 上一頁  1234

所有顯示的時間為 UTC + 8 小時


誰在線上

正在瀏覽這個版面的使用者:沒有註冊會員 和 49 位訪客


不能 在這個版面發表主題
不能 在這個版面回覆主題
不能 在這個版面編輯您的文章
不能 在這個版面刪除您的文章
不能 在這個版面上傳附加檔案

搜尋:
前往 :  
Powered by phpBB® Forum Software © phpBB Group
正體中文語系由 竹貓星球 維護製作
© moztw.org, Mozilla Foundation
MozTW,Mozilla 台灣社群