HTML (HyperText Markup Language)
HTML 教學

作者：Linux0911
發表日期：2007-08-07
最後修正：2007-08-07
文章回顧：CSS (Cascading Style Sheet) 教學
轉載請註明來源：http://linux0911.no-ip.info/my_style/doc/html/ 


常常聽別人問，你會不會 HTML，CSS，網頁設計等，是否聽得一頭霧水快昏倒了 ?_?

HTML 是甚麼?

基本上只要知道它是個網頁就可以了



那麼接下來趕快來學怎麼寫~



先學會完整的架構

一個基本的網頁所需要的元件可以在以下看到

是這樣寫的


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>標準 XHTML 1.0 格式.html</title>
<meta name="keywords" content="關鍵字放置處" />
<meta name="description" content="描述簡介放置處" />
<meta name="Author" content="Linux0911" />
<meta http-equiv="MSThemeCompatible" content="Yes" />
<meta name="MSSmartTagsPreventParsing" content="TRUE" />
<link type="text/css" rel="stylesheet" href="CSS 放置處.css" />
<script type="text/javascript" src="JavaScript 放置處.js"></script>
</head>

<body>

</body>

</html>


<!DOCTYPE html PUBLIC> 是定義網頁類型是屬於甚麼標準的，本站教學都以 XHTML 1.0 Strict 來教學

<head> 和 </head> 是頭的部分

<body> 和 </body> 是身體的部分

<html> 和 </html> 是網頁整體的部分


那麼你懂得這個架構後，以後的主要顯示物件將都會寫在

<body> 跟 </body> 之間


表格 table 怎麼寫?


<table style="width: 85%">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
</table>



效果如下



	

		1
		2
		3
	

	

		4
		5
		6
	





要框框有顏色


<table style="width: 85%; border: 1px solid lime">
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
</table>



效果如下



	

		1
		2
		3
	

	

		4
		5
		6
	








直排合併的寫法


<table style="width: 85%; border: 1px solid lime">
	<tr>
		<td rowspan="2">14</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>5</td>
		<td>6</td>
	</tr>
</table>



效果如下



	

		14
		2
		3
	

	

		5
		6
	






橫排合併的寫法


<table style="width: 85%; border: 1px solid lime">
	<tr>
		<td colspan="3">123</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
</table>



效果如下



	

		123
	

	

		4
		5
		6
	




請注意裡面的關鍵元素 colspan、rowspan、style 等都是很方便也是重要的

boder 的定義寫法, 框線粗細 框線形式 框線顏色
以上表格的框線是這樣定義的
border: 1px solid lime

想深入瞭解 CSS 請參閱本站 CSS 教學文件









還不動手寫看看!!




基本的 HTML 格式要先學會，接下來我們要為您的網頁開始上色了!

系列文章：CSS (Cascading Style Sheet) 教學

 free counters