好孩子的網頁設計
第三課: XHTML Text Module (1/2)
Jedi
Jedi
2006
text/html
TITLE::好孩子的網頁設計,第三課
[[IMG src="../image/20060524.png" width="464" height="464"]]
----
段落與標題
----
(1/2)
----
0.
----
<, >
([[EM:l]]ess [[EM:t]]han, [[EM:g]]reater [[EM:t]]han)
----
<, >
[[EM:<]], [[EM:>]]
----
&
([[EM:amp]]ersand)
----
&
[[EM:&]]
----
([[EM:n]]on-[[EM:b]]reaking [[EM:sp]]ace)
----
[[EM: ]]
----
"
([[EM:quot]]ation mark)
----
"
[[EM:"]]
----
<" ">
----
<" ">
----
HTML Entities
----
1.
----
段落
----
HEADER::段落
字句段落
----
字句段落
文章段落
----
字句段落
文章段落
區塊
----
字句段落
([[EM:span]])
----
HEADER::字句段落
[[EM:<span>]]
----
<span>一小段文字</span>
----
<span>目前位置:首頁 » 授權標章</span>
----
HEADER::
文章段落
([[EM:p]]aragraph)
----
HEADER::文章段落
[[EM:<p>]]
----
<p>一段文章</p>
----
<p>關於創作控制的論辯,經常趨向兩極。一
端是完全的控制,主張在這個世界裏,對作品的
所有使用行為均受到管制,而著作人「保留所有
權利」(以及之後「保留部分權利」的概念)被
視為常規。另一端則是一種無政府的狀態,認為
在這個世界裏,創作者享有寬廣的自由空間,但
卻極易受到剝削。然而,曾經是驅動兼重創新與
保護之著作權體系的力量,均衡、折衷及調和這
樣的概念,如今已瀕臨絕跡。</p>
----
詩
----
<p>白日依山盡
黃河入海流
欲窮千里目
更上一層樓</p>
----
白日依山盡 黃河入海流 欲窮千里目 更上一層樓
----
白日依山盡 黃河入海
流 欲窮千里目 更上
一層樓
----
HEADER::
換列
(換行, [[EM:br]]eaking)
----
HEADER::換列
[[EM:<br />]]
----
<p>白日依山盡[[EM:<br />]]
黃河入海流[[EM:<br />]]
欲窮千里目[[EM:<br />]]
更上一層樓</p>
----
白日依山盡
黃河入海流
欲窮千里目
更上一層樓
----
HEADER::
區塊
([[EM:div]]ision)
----
HEADER::區塊
[[EM:<div>]]
----
在一起
----
[[EM:意義]]
----
意義
[[EM:概念]]
----
意義
概念
[[EM:視覺]]
----
意義
概念
[[EM:排版]]
----
<div>……</div>
----
<div>
<p>關於創作控制的論辯,經常趨向兩極……</p>
<p>Creative Commons 正在努力地恢復這些力量……</p>
</div>
----
HEADER::
2.
----
標題
([[EM:h]]eader)
----
HEADER::標題
level:
[[EM:1]], [[EM:2]], [[EM:3]], [[EM:4]], [[EM:5]], [[EM:6]]
----
[[EM:<h1>]], [[EM:<h2>]],
[[EM:<h3>]], [[EM:<h4>]],
[[EM:<h5>]], [[EM:<h6>]]
----
<h1>第一層大標題</h1>
----
<h2>第二層標題</h2>
----
<h3>第三層標題</h3>
----
<h4>第四層標題</h4>
----
<h5>第五層標題</h5>
----
<h6>第六層標題</h6>
----
慣例
----
<h1> 對應
<title>
----
頁面名稱
----
一致性
----
<h1>
祇有一個
----
次標題
----
<h2>
……
----
HEADER::
標題與段落
----
HEADER::標題與段落
<div>
<h2>次標題</h2>
<p>第一段……</p>
<p>第二段……</p>
</div>
<span>無關的幾個字</span>
----
[[EM:<div>
<h1>大標</h1>]]
<div>
<h2>次標題</h2>
<p>第一段……</p>
<p>第二段……</p>
</div>
<span>無關的幾個字</span>
[[EM:</div>]]
----
HEADER::
作業
----
HEADER::作業
自我介紹
----
結構正確
----
標題清晰
----
三項以上
----
兩段以上
----
「待續」
----
HEADER::
預告
----
HEADER::預告
強調
----
資訊種類