然后選擇文件另存為index.htm
雙擊打開(kāi)看一下
好了，一個(gè)簡(jiǎn)簡(jiǎn)單單的網(wǎng)頁(yè)就完成了，是不是很簡(jiǎn)單?。?br>你是不是還在疑惑：這只是在我自己的電腦打開(kāi)的呀，要怎么樣才可以讓別人看到我做的網(wǎng)頁(yè)呢？
下一步將解決你的疑惑，請(qǐng)看下步：如何讓別人看到我的網(wǎng)頁(yè)？
什么是網(wǎng)頁(yè)？
你明白什么是網(wǎng)頁(yè)嗎？
你知道網(wǎng)頁(yè)是怎么在互聯(lián)網(wǎng)上傳播的嗎？
如果你不知道的話，沒(méi)關(guān)系。。。
下面，我們來(lái)認(rèn)識(shí)一下，到底什么是網(wǎng)頁(yè)。
新建一個(gè)記事本，打開(kāi)它，把下面的代碼復(fù)制到記事本里。(先別管下面的鬼畫(huà)符，想當(dāng)年我也飽受它之苦，后面給大家講解)
<html>
<head>
<title>這就是網(wǎng)頁(yè)啦</title>
</head>
<body>
我也會(huì)做網(wǎng)頁(yè)了
</body>
</html>
到底要怎么樣才可以讓別人看到我的網(wǎng)頁(yè)呢？
網(wǎng)頁(yè)又是怎么樣在互聯(lián)網(wǎng)上傳播的呢？
要想別人看到你所做的網(wǎng)頁(yè)，就必須得有一個(gè)空間，來(lái)存放你的網(wǎng)頁(yè)文件。
下面，教大家申請(qǐng)免費(fèi)空間。(現(xiàn)在網(wǎng)上有好多的免費(fèi)空間，大體的申請(qǐng)流程都差不多的)
請(qǐng)緊跟著我的步驟：
http://xinwen365.com/reg1.asp
打開(kāi)這個(gè)網(wǎng)址填寫(xiě)好資料,如下圖:
填好資料后，確認(rèn)提交，就可以看到你的信息了！如下圖:
好了，到了這里，網(wǎng)址有了，F(xiàn)TP地址也有了，我們可以上傳我們第一步所做的那個(gè)網(wǎng)頁(yè)了：
打開(kāi)IE瀏覽器，在地址欄輸入你的FTP地址，如下圖：
輸入完了后，點(diǎn)擊登錄，看到了下圖的界面，就進(jìn)入了FTP服務(wù)器啦，網(wǎng)頁(yè)里面的所有文件都在這里面，由你來(lái)管理
下面，我們第一步所制作的那個(gè)網(wǎng)頁(yè)復(fù)制上去，在提示下圖對(duì)話框時(shí)，選擇“是”
就這樣，我們的網(wǎng)頁(yè)就傳播到互聯(lián)網(wǎng)上了，現(xiàn)在可以打開(kāi)我們申請(qǐng)時(shí)所得到的網(wǎng)址，
就可以看到自己做的網(wǎng)頁(yè)啦(在全球任何地方，打開(kāi)你的網(wǎng)址，都可以看到你所做的網(wǎng)頁(yè))
在IE瀏覽器輸入我們所申請(qǐng)得到的那個(gè)網(wǎng)址
我的網(wǎng)址是：tammychen.xinwen365.com
看下我們所制作的網(wǎng)頁(yè)吧，
經(jīng)過(guò)上一步的學(xué)習(xí)，了解到一個(gè)標(biāo)記可以有多個(gè)屬性，那么，我們來(lái)學(xué)習(xí)這一步就容易多了。
先來(lái)看下代碼：
<img src="images.jpg" width="300" height="225" />
明白是什么意思嗎？呵呵，要在網(wǎng)頁(yè)中插入圖片，這時(shí)我們就要用到img標(biāo)記了。
先來(lái)看看第一個(gè)屬性src，src屬性是指定圖片的路徑的。。。
src="images.jpg" 這個(gè)的意思就是：顯示images.jpg這個(gè)圖片
第二個(gè)屬性width，指定圖片的寬度，單位默認(rèn)為像素
width="300" 這個(gè)指定了圖片的寬度為300像素
第三個(gè)屬性height，指定圖片的高度，單位默認(rèn)為像素
height="225" 這個(gè)指定了圖片的高度為225像素
除了這幾個(gè)屬性外，img標(biāo)記的屬性還有很多，我這就不一一解釋了，還是那句老話：要學(xué)會(huì)搜索。有需要自己上www.google.com或www.baidu.com搜索吧。
這步來(lái)講講如何給圖片做鏈接，不知道大家還記不記得第六步的例子，給文字做鏈接。。。
其實(shí)圖片鏈接，可以說(shuō)是第六步跟第七步的結(jié)合，只要把顯示文字的換成顯示圖片的代碼就可以了
下面我們來(lái)看一下代碼：
<a href = "index2.htm">鏈接到index2.htm</a>
這是第六步的文字鏈接代碼。。。顯示的文字是“鏈接到index2.htm”
我們只要把“鏈接到index2.htm”這段換成第七步的那段代碼，就成了圖片鏈接了，看代碼：
<a href = "index2.htm"><img src="images.jpg" width="300" height="225" /></a>
也就是說(shuō)，只要把<img>標(biāo)記放中<a></a>標(biāo)記之間，就有了鏈接的功能。。。
文字鏈接跟圖片鏈接所不同的只是：
原來(lái)顯示文字的地方，我們用來(lái)顯示圖片了。。。
就這樣簡(jiǎn)單```
除了文字鏈接跟圖片鏈接外，還有錨鏈接，郵件鏈接等等~~`我就不一一講了```想了解的可以上網(wǎng)查資料```不明的也可以問(wèn)我````
學(xué)習(xí)到這里，不知道大家有沒(méi)有注意到，所有顯示的圖片，文字都是不成形不成樣的```
呵呵，放心吧，接下來(lái)我們會(huì)講到頁(yè)面的排版標(biāo)記的````
真是不好意思，這么久才更新第九步，呵，不多說(shuō)了，看正文
這步我們來(lái)講一下如何添加網(wǎng)頁(yè)背景，幾乎所有的網(wǎng)頁(yè)中，都有背景，這個(gè)在網(wǎng)頁(yè)制作中，是最常用到的！
要添加網(wǎng)頁(yè)的背景，得用CSS樣式來(lái)完成了，看代碼：
<style type="text/css">
<!--
body {
background-image: url(bj.jpg);
background-repeat: repeat-y;
background-color: #333333;}
-->
</style>
下面對(duì)代碼進(jìn)行解釋:
<style type="text/css"> 頭標(biāo)記，這個(gè)說(shuō)明用的是css樣式，所有CSS代碼都必須放在里面，結(jié)束標(biāo)記是</style>
body 這是一個(gè)標(biāo)簽，body就是定義body標(biāo)記里面的內(nèi)容，標(biāo)簽可以有多個(gè)屬性，屬性跟值都 必須包含在{ }大括號(hào)之間
background-image: url(bj.jpg); 背景圖片屬性，bj.jpg是圖片的路徑
background-repeat: no-repeat; 這個(gè)標(biāo)記是用來(lái)設(shè)置背景圖片要怎顯示 ，紅色部分是值，值分別為：no-repeat為不重復(fù) repeat為重復(fù) repeat-x為橫向重復(fù) repeat-y為縱向重復(fù)
background-color: #333333; 這個(gè)是設(shè)置背景色的，紅色部分是顏色代碼
最后講一下,<!--******-->在CSS樣式外面加上這個(gè)HTML注釋的作用是：如果CSS樣式不正確，可以防止錯(cuò)誤顯示
添加背景音樂(lè)，其實(shí)很簡(jiǎn)單，看下面代碼：
<bgsound src="背景音樂(lè)地址" loop=3>
只要把這段代碼，放在head標(biāo)記之間，就可以播放背景音樂(lè)了
用bgsound標(biāo)記來(lái)實(shí)現(xiàn)背景音樂(lè)的播放
src屬性的值就是背景音樂(lè)的地址，可以是絕對(duì)路徑，可以是相對(duì)路徑
loop屬性是設(shè)置播放次數(shù)的```loop=3 這樣播放三次就停止播放了``如果要無(wú)限循環(huán)播放，可以把loop的值設(shè)置 為-1
表格，在網(wǎng)頁(yè)布局中最常用的，制作網(wǎng)頁(yè)的第一步就是頁(yè)面布局，所以，我們有必要學(xué)習(xí)表格的知識(shí)！
現(xiàn)在，我們來(lái)講一下表格的結(jié)構(gòu)以及相關(guān)的屬性！
下面看代碼一：
<table>
<tr>
<td>這里輸入表格的內(nèi)容</td>
</tr>
</table>
上面是一個(gè)一行一列的表格。。<table>是表格標(biāo)記，<tr>表示表格中的行，<td>表示表格中的列。。。
那么，要寫(xiě)一個(gè)一行三列的表格，又該怎么樣呢？
看代碼二：
<table>
<tr>
<td>這是第1行的第1列</td>
<td>這是第1行的第2列</td>
<td>這是第1行的第3列</td>
</tr>
</table>
表格的結(jié)構(gòu)是這樣的，<table>標(biāo)記包含<tr>標(biāo)記，<tr>標(biāo)記包含<td>標(biāo)記，<td>標(biāo)記表示列，在上面代碼中，<tr>包含著三個(gè)<td>標(biāo)記，那就是一行三列了
現(xiàn)在我們?cè)賮?lái)看看，三行一列的表格又是什么樣的..
代碼三：
<table>
<tr>
<td>這里是第1行的第1列</td>
</tr>
<tr>
<td>這里是第2行的第1列</td>
</tr>
<tr>
<td>這里是第3行的第1列</td>
</tr>
</table>
不要被這些亂七八糟的標(biāo)記弄糊涂了，大家仔細(xì)看下，上面的代碼跟代碼一的有什么不同？
代碼一的是一行一列，代碼三的是三個(gè)一行一列
那么，三行三列又是怎么樣的呢？
看代碼四:
<table>
<tr>
<td>第1行第1列</td>
<td>第1行第2列</td>
<td>第1行第3列</td>
</tr>
<tr>
<td>第2行第1列</td>
<td>第2行第2列</td>
<td>第2行第3列</td>
</tr>
<tr>
<td>第3行第1列</td>
<td>第3行第2列</td>
<td>第3行第3列</td>
</tr>
</table>
把代碼二的跟代碼三的結(jié)合起來(lái)，就是三行三列了，大家認(rèn)真比較一下!
現(xiàn)在了解一下表格的屬性：
width="150" 寬度
border="100" 高度
（這兩個(gè)屬性大家應(yīng)該很熟悉吧）
border="1" 表示邊框的粗細(xì)為1像素
cellspacing="3" 單元格的間距
cellpadding="2" 單元格的邊距
我這里講的都只是基本的知識(shí)，大家想要了解更多，可以看看下面的教程:
http://www.xu5.cn/html.html#t9
這步教程就講到這里，大家可以結(jié)合前面所學(xué)到的標(biāo)記，嘗試一下，在表格中，插入圖片，文字，并進(jìn)行鏈接!
聯(lián)系客服
