7-2.1HTML(HyperText Markup Language, 超文件標記語言)
|
首頁 |
首頁以index或default為主檔名；文件以htm、html為副檔名。 |
|
|
開啟 |
在IE，選取「檢視/原始檔」可在「記事本」開啟HTML文件。 |
|
|
組成 |
HTML文件，由標籤(Tag)及文件內容(文字、圖片、聲音、影片)組成。 HTML網頁文件檔是純文字檔。 |
|
|
語法 |
HTML語法是以「樹狀結構」呈現，若為對稱性標籤，則開始與結尾標籤以反方向順序排列。 <!DOCTYPE …> <html> <head> <meta …> <title>視窗標題</title> </head> <body> 網頁內容 </body> </html> |
|
|
標籤 |
<html>…</html> |
文件的開始與結束 |
|
<head>…</head> |
標示文件資訊，包括標題及其他對應網址 |
|
|
<title>…</title> |
瀏覽器畫面標題列上的「標題」 |
|
|
<body>…</body> |
網頁文件的本文部分 |
|
|
<br>…</br> |
換行 |
|
|
<p>…</p> |
分段，</p>可省略 |
|
|
<hr>…</hr> |
產生水平分隔線 |
|
|
<hn>…</hn> |
標題文字，n從1~6，n愈大，字愈小 |
|
|
<tr></tr> |
在網頁表格中建立一列 |
|
|
<td></td> |
在該列建立一欄 |
|
|
<font color="色碼">…</font> |
顏色，色碼以"RRGGBB"十六進位表示 |
|
|
<font face="字型">…</font> |
字型 |
|
|
<font size=”n”>…</font> |
文字大小，n從1~7，n愈大，字愈大 |
|
|
<b>…</b> |
粗體 |
|
|
<i>…</i> |
斜體 |
|
|
<u>…</u> |
底線 |
|
|
<p align=”left”>…</p> |
文字靠左對齊 |
|
|
<p align=”center”>…</p> |
文字置中對齊，<center>…</center> |
|
|
<p align=”right”>…</p> |
文字靠右對齊 |
|
|
<img src=”圖檔名稱”>圖檔說明</img> |
載入圖檔，圖檔名稱需加上路徑 border=”n”，邊框大小，n代表像素 height=”n”，高度 width=”n”，寬度 alt=”文字”，圖片說明 </img>，可省略 |
|
|
<table>…</table> |
製作表格 border=”n”，邊框大小，n代表像素 height=”n”，高度 width=”n”，寬度 |
|
|
<a href=”連結網址”>文字或圖片</a> |
製作超連結 1.電子郵件：「mailto:電子郵件信箱」 2.書籤：「#書籤名稱」 3.絕對路徑網址：完整位址，包含通訊協定、網頁伺服器、路徑與檔案名稱 4.相對路徑網址：網頁相對的路徑位址 5.目標框架：target=”框架名稱” _self：在原視窗中開啟 _blank：在新視窗中開啟 _top：在最上層視窗(整頁)開啟 _parent：在父視窗中開啟 6.滑鼠指標移至超連結的文字或圖片上，指標形狀由 |
|
|
<a name=”書籤名稱”>文字或圖片</a> |
定義圖片為書籤 |
|
|
<marquee>…</marquee> |
產生跑馬燈效果 |
|
|
<frameset> <frame src=”網頁檔名”> </frameset> |
將網頁分割成不同框架及設定框架中要顯示的網頁 <frameset rows=”15%,*,15%”>，分割為上下3個框架，最上及最下的框架各占15%寬度，其餘為中間框架寬度 frameborder=” border=”n”，框線大小 bordercolor=”顏色” |
|
|
<script></script> |
<script language=”VBScript”></script> <script type=”text/JavaScript”></script> |
|
|
<%...%> |
使用ASP程式 |
|
|
<? php...?> |
使用PHP程式 |
|
|
<embed>…</embed> |
在網頁中嵌入Flash、mid、MP3等 |
|
|
<!--註解文字--> |
加入註解說明 |
|
7-2.2CSS(Cascading Style Sheets, 層疊樣式表, 串接式表單)
|
功能 |
1.能重新定義HTML標籤，可自行增加標籤樣式，使網頁外觀呈現更靈活。 2.簡化網頁程式碼，加速網頁開啟的速度。 3.屬於純文字編輯。 |
|
|
宣告 |
宣告內容包含屬性與屬性的設定值，以「{ }」包住。每個標籤可定義多個屬性，屬性間以「;」分隔。 CSS宣告方式： 物件名稱 {屬性: 設定值} |
|
|
引用 |
在HTML網頁引用CSS |
|
|
外部連結 |
在<head>…</head>間，連結CSS文件檔(.css)命令。 <head> … <link rel=stylesheet
type="text/css" href="test.css"> … </head> |
|
|
網頁內嵌 |
在<head>…</head>間，以<style>…</style>定義共同樣式。 <head> <style type=“text/css”> 標籤名稱1 {style=屬性1: 設定值1; 屬性2: 設定值2} … </style> </head> |
|
|
行內套用 |
<標籤名稱 style=屬性1: 設定值1; 屬性2: 設定值2>內容</標籤> |
|
7-2.3其他標記語言
|
XML(eXtensible Markup Language, 可延伸標記語言) |
1998年，W |
|
|
HTML |
XML |
|
|
<br> 書名 <br> 作者 <br> 出版商 |
<title> 書名 </title> <author> 作者 </author> <publisher> 出版商 </publisher> |
|
|
XHTML(eXtensible HyperText Markup Language, 可擴展超文件標記語言) |
2000年，W |
|
沒有留言:
張貼留言
注意：只有此網誌的成員可以留言。