Dreamweaver学术课程.ppt

HTML + Dreamweaver學術課程 甚麼是HTML？ HTML 全名是Hyper Text Markup Language﹐是電腦語言的一種。這種電腦語言是可透過瀏覽軟件(Browser - Internet Explorer , Netscape)翻譯出來﹐翻出來的就是我們看到的網頁了。HTML 是可以用一些簡單的文字編輯器編寫的﹐如記事簿(Notepad)和小作家(WordPad)等。我們只須在文字編輯器編寫好後﹐在存檔時存成純文字檔﹐並用副檔名(Extension).html 或.htm﹐好像index.html 或index.htm﹐不然﹐有些瀏覽器便不會把HTML 翻出來﹐而我們從瀏覽器中只會看到我們所編的HTML 原始碼(Source Code)。 HTML基本功 在HTML 中﹐標籤(Tags)是用來控制整個網頁的元素﹐例如文字﹐圖片等。1. 對稱型Tag 對稱型Tag 呈前後包夾狀，它有起始標籤XX與結束標籤/XX，夾在這兩個 標籤中的物件，會依該標籤的定義呈現效果，例︰html與/html。2. 單一型Tag 非包夾型Tag，它會在出現當下便直接定義該位置的效果，例︰br與p。 必備的三組Tag： 1. html/html宣告以下的文件是HTML 碼； 2. head/head定義適用於整份文件的程式碼； 3. body/body定義文件的內容。 Hyper Text Markup Language (HTML) Prepared by 包含在BODY/BODY中的便是最重要內文了﹐大部份網頁的元 其﹐聲音等。 HTML/HTML:HTML 語言開始的宣佈 HEAD/HEAD:頁首的宣佈 TITLE/TITLE包含在HEAD/HEAD之內 其他有關網頁的資料﹐及JAVASCRIPT 都可在HEAD/HEAD之內 在HEAD/HEAD之內只有TITLE/TITLE之內的內容是用者可見的 TITLE/TITLE:網頁的標題 BODY/BODY:內文的宣怖 BODY/BODY內的屬性: BGCOLOR=xxxxxx:網頁的背景顏色﹐xxxxxx 是RGB 碼 BACKGROUND=檔名.jpg or .gif:網頁的背景圖案 TEXT=xxxxxx:網頁內文文字顏色 LINK=xxxxxx:網頁內超連結顏色 ALINK=xxxxxx:滑鼠按下超連結不放時的顏色 VLINK=xxxxxx:到訪過的超連結的顏色 Example 1 html head title本頁的標題/title /head body bgcolor=#ffffff text=#0000ff font size=+1這是放置內容的地方/font p font size=+2 color=#00ff00這是我第一個網頁。/font /body /html 文字格式 BODY TEXT=xxxxxx:xxxxxx 是設定整頁文字顏色﹐xxxxxx 可以是RGB 碼 BASEFONT SIZE=n:n 是設定整頁文字的大小﹐原設值是3﹐數字越大字體越大 FONT/FONT:文字字形設定 FONT/FONT內的屬性: FACE=xxxxxx:文字字款設定﹐如Arial, Times SIZE=n:文字大小設定﹐n 原設值是3﹐數字越大字體越大 n 也可是+1﹐+2﹐-1﹐-2 等﹐這是基於原設值3 來加減字體的大小 COLOR=xxxxxx:文字顏色設定﹐xxxxxx 的數值請參顏色表 B/B:文字粗體設定 I/I:文字斜體設定 U/U:文字加底線設定 STRIKE/STRIKE:文字中間加橫線設定 SUP/SUP:文字上體字設定 SUB/SUB:文字下體字設定 BLINK/BLINK:閃爍的文字設定﹝Netscape 才看得到﹞ Hn/Hn:網頁標題設定﹐n 是數字﹐當n 是1 時字體最大 文字排版 CENTER/CENTER:文章排中 BR:換到下一行 P:隔一行 P/P的屬性: ALIGN=LEFT:文章排左 ALIGN=CENTER:文章排中 ALIGN=RIGHT:文章排右 NOBR/NOBR:不換行 BLOCKQUOTE/BLOCKQUOTE:文字向左右排縮 PRE/PRE:根據HTML 原始檔內的排版 HR:橫分隔線 HR的屬性: SIZE=n: n 是高度﹐單位是pixel WIDTH=w: w 是闊度﹐單位是pixel﹐也可以是比例(%) ALIGN=方向:方向可以是LEFT, CENTER, RIGHT NOSHADE:不要陰影 圖片處理 IMG SRC=圖片檔位置與名字.jp