:::
5. 網頁概念
5-1 基本語法介紹
基本語法
標籤語法基礎
語法使用規則，要以頭尾包著要表達的內容，忽略大小寫。開頭 <XXX>，結尾 </XXX> ，例 <TITLE>基本標籤教學 </TITLE>
基本html5樣式
<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8">
<title>我的第一個網頁</title>
</head>
<body>
網頁中的內容都要放在這個區塊中！
第一行文字
第二行文字
文字有很多空白 像這樣
<p>正確段落換行</p>
指令換行<br><br><br><br><br><br><br>
空白字 使用特定語法
</body>
</html>
- 把上面的內容貼到記事本中（Linux 使用 gedit 文字編輯器)：
- 要做成網頁，所以檔案存成例如 1.htm 或 1.html ，編碼記得改為 UTF-8
- 最後直接開啟檔案，看到的結果：
文字字體
<H1> 標題大小1</H1>
<H2> 標題大小2</H2>
<H3> 標題大小3</H3>
<H6> 標題大小6</H6>
<b>粗體</b>
<i>斜體</i>
<u>加底線</u>
<blink>閃爍</blink>
直接換行<br>
<p>段落換行</p>
<p><FONT SIZE=5 COLOR=red> 字體大小5及顏色紅色。</Font></p>
<p><FONT SIZE=2 COLOR=#ff00ff> 字體大小2及顏色（紅綠藍三原色值）。</Font></p>
段落排版
圖型
<IMG SRC="https://www.syps.tn.edu.tw/uploads/tadgallery/2019_06_10/2027_%E5%85%AD%E4%B9%99.jpg" >
以上語法，表示顯示網路上的圖形，可以試著改為自已的圖片檔。
這組標籤不需要 </IMG>做結尾。
如果改為自已的圖檔。
這組標籤不需要 </IMG>做結尾。
如果改為自已的圖檔。
表格
<TABLE border=1>
<TR> <TD>第一行第一格</TD> <TD>第一行第二格</TD></TR>
<TR> <TD>第二行第一格</TD> <TD>第二行第二格</TD></TR>
</TABLE>
連結
<A HREF="http://www.syps.tn.edu.tw">連到新營國小</A>
也可以連結到其他的檔案、網站
<A HREF="http://nas.syps.tn.edu.tw/data/traffic.jpg">按這裡會看到新營國小地圖</A>
代表連結到 image 次目錄中的 ex71.gif 圖案。
<A HREF="1.htm">連到網頁</A>
注意：
c:\image\01.gif 這樣的連結目錄是錯誤的，這樣的連結會連結到觀看者的本機目錄，自然會造成錯誤。
c:\image\01.gif 這樣的連結目錄是錯誤的，這樣的連結會連結到觀看者的本機目錄，自然會造成錯誤。
網頁編輯工具
- 線上編輯工具測試