HTML简介文字的变化超连结的使用-高雄大学.pptVIP

HTML簡介、文字的變化、超連結的使用 主講：朱漢琳 課程綱要 一、HTML 的基礎概念 什麼是 HTML？ HTML 文件的基本結構。 編寫 HTML 文件的工具。 二、常用的 HTML 標籤介紹 HTML 頭部（HEAD）標籤 文字格式設定 超連結 什麼是 HTML？ HTML 代表超文字標記語言(Hyper Text Markup Language)。 HTML的標準是由國際的組織 W3C（The World Wide Web Consortium）發所佈，最新的版本為 4.01。 由許多標籤（tag）所構成的元素（element）組合而成。 是一種純文字檔案，可以使用各種文字編輯器來進行編輯。 副檔名為.htm或.html。 什麼是 HTML？ 透過 HTTP ( HyperText Transfer Protocol) 網路通訊協定，便能夠在世界各地透過 WWW (World Wide Web) 的架構做跨平台的交流。 以 HTML 格式所儲存的文件檔案，經由瀏覽器（如 Internet Explorer或 Netscape Navigator）顯示出來。 HTML 文件的基本結構 一個簡單的網頁：CH01.htm 原始檔如下： 標籤（Tag） 標籤是由一個「」及「」符號所構成，例如 HTML、 TITLE。 標籤的結構可分為兩種：一種是成對的標籤，另一是單一標籤。 成對標籤：由起始標籤（opening tag）及結束標籤（closing tag）組成。大部分的標籤都屬於此類。例如：font…/font（代表字型的設定）。 (註：所謂的結束標籤，是在原標籤文字前加上一個「/」，例如：/font，通常表示該標籤特性的結束。) 單一標籤：顧名思義，就是只有起始標籤。例如：hr（代表水平線）、br（代表斷行）。 標籤屬性 ：大部分的標籤都可以藉由標籤的屬性來更改呈現方式，標籤屬性的格式為 [屬性名稱＝屬性值]，標籤屬性介於[標籤名稱]與 [] 之間，例如 ： font size=‘4’字體大小/font　 字體大小 font size=‘5’字體大小/font　 字體大小 標籤（Tag） 標籤的使用 ：利用起始標籤標籤名稱 與結束標籤/標籤名稱 所包夾起來的文句，即被賦予這個標籤所代表的意義。瀏覽器在解讀出這些標籤之後，便可根據這些標記的意義來對其所包夾的文句進行編排。例如，HTML 與/HTML 是要告訴瀏覽器，其所包夾的文件內容是一份 HTML 文件；由 H2 與 /H2 所包夾的文句需以第二種標題形式（字形較大、粗體等）來顯示。 其他注意事項： 標籤及屬性都沒有大小寫的區分。 屬性質的引號用「雙引號」或「單引號」均可。 瀏覽器對HTML文件中的空白字元將有特殊的處理。如果使用一個以上的空白字元，第二個及以後的空白將被忽略，僅認可第一個空白字元。如果您希望保留更多的空白，有以下二個方式： 使用「全形」的空白字元。 以「nbsp;」來代表一個空白字元。（需要兩個空白字元時就連續使用nbsp;nbsp;） 特殊字元表示法 由於在HTML中，、、、空白 等符號會被用來當成標記使用，因此，當瀏覽器讀到這些符號時，會自動把它們當成標記而無法正確顯示出來。所以，若您要在瀏覽器中顯示這些符號，必需使用以下之表示法： HTML 文件的基本架構 ※ HTML 文件由 HTML 與/HTML 所包夾，其中包括 [檔頭] 與 [主體] 兩部分： 檔頭：由 HEAD 與 /HEAD 所包夾的部分，其中最重要的是 TITLE 與 /TITLE 所包夾的文件主題，這個主題會出現在瀏覽器的 Title Bar。 主體 ：由 BODY 與 /BODY 所包夾的部分，所有的網頁內容（包含文字、圖片、多媒體物件，甚或是其他的標籤）都會放在這一對標籤之內。 編寫 HTML 文件的工具 文字編輯器 ： 任何平台上的任何文字編輯器都可使用，例如 Windows 裡的Notepad、Wordpad 等，甚至可使用 Word 並以純文字模式儲存檔案亦可。使用這些文字編輯器來直接撰寫並儲存符合 HTML 格式的文件，比較能得到簡潔、洗鍊、單純的 HTML 文件。缺點是必須熟悉 HTML 格式的各種標記與其屬性。 HTML 設計軟體 ： 市面上有許多HTML 設計軟體，例如 Microsoft FrontPage 、 Netscape Composer 、或 Macromedia Dreamweaver 等，這些軟體提供良好的圖形介面，讓使用者能以所見即所得（WYSIWYG, What You See Is What You Get）的方式，很容易地設計、編排出所想要呈現的網頁，並且以 HTML 的格式來儲存檔