NVU實作首頁(index) 113

一、何謂個人首頁?

(一)首頁(Homepage):自己網站的第一個畫面，用來歡迎別人、連結其他的網頁。

(二)一般而言，網頁主機首頁的檔名為 index.html ，要小寫、半形，不能打錯字或有空格，輸入自己的網址，即可見此網頁!

否則即見如下圖：

二、建立首頁檔：(輸入完成且正確存檔 60 分)

(一)在第一行輸入歡迎文字:可自訂 →文字 2 種以上顏色，放大 2-4 倍。

例如: 歡迎光臨~的網頁、 ~的家、 ~小站、 ~の窩、Welcome to~Homepage ...等

(亦可使用原始碼進行編輯 <font size="" color="">)

（二）另存新檔：

1. 請輸入本頁的標題：7xx-xx○○○的首頁

(爾後可於 1.格式-->頁面標題與屬性進行修改或是 2.修改原始碼 --> <title>自我介紹</title> ）

2. 網頁的檔名：index.html --->檔名一定要小寫！

3. 檢查是否有誤

三、加入背景圖(!!請務必先完成存檔才做以下動作!!)

!!強烈提醒!!

⊕請將index.html網頁檔存檔在D：。

⊕先在D:建立img資料夾，將背景圖、歡迎光臨圖檔存檔在D：的img資料夾。

(一)網頁背景: (加入背景 70 分)

*背景圖庫下載: 下載點 I 、下載點 II (更多創用CCO圖庫介紹)

1.先選擇你所喜歡的背景圖片(不要選太花的)，背景的英文是 background

檔名為bg02.jpg(.png)，請存於img資料夾。

（檔名不要有中文字或空格、特殊符號）

2.選擇NVU 格式-->頁面文字顏色及背景顏色-->選擇剛剛所存的檔案，即可變換背景。

(二)插入歡迎光臨圖片: (請務必存在img資料夾中)

歡迎光臨圖片下載 (gif動畫要在瀏覽器瀏覽才會動。)

※加完歡迎圖後，在後面按兩下 enter 將游標移到下方。

3.!!完成後務必存檔!!

◎Web網頁的絕對路徑及相對路徑 ◎

1.相對路徑: 相對於現在目錄的路徑表示，也就是你現在這個檔案在哪裡，這個目錄的路徑起始點就在哪裡，所以每個檔案的相對路徑起始點都可能會不同。

範例:

2.絕對路徑: 絕對路徑是一個絕對位置，他不會隨著檔案位置的變換而改變他的路徑。如: 網址

範例:

四、插入表格:(正確建立表格並完成設定 80 分)

(一)首先在歡迎光臨標語下，插入水平線或歡迎圖片，兩次 Enter 鍵，輸入:

「常用的連結」。

(二)

1.選擇 (1)插入->表格或 (2)表格->插入

2.插入表格，選擇 2x3 ，然後按確定。

3.表格設定:

(1)輕按網頁表格，選擇「表格」選項

(2)調整框線與留白：設定為3、2、2

(3)表格對齊方式選擇為: 靠中

(4)調整高度、寬度為：15、70，相對於視窗的百分比

4.先全選表格，再置中對齊。 (此動作是把表格中的文字置中)

(四)!!完成後務必存檔!!

五、建立超連結:
(6個超連結正確完成 95 分,每少一個-3 分,未能正確設定彈出新視窗-1 分)

(一)建立超連結 6 個:(表格標題參見最後成品要求)

1.已有之 2 個自己網頁=> 1.html(網頁原始碼)、a.html(自我介紹)

2.1 個學校首頁=> 銘傳國中 https://mcjh.kl.edu.tw

3.3 個連外網頁=>自訂,如:FB、GOOGLE、IG、YOUTUBE...等等。

範例:~.html 或 http://~網址/

(二)原視窗開啟、彈出新視窗

1.自製網頁:網頁原始碼、自我介紹

(同視窗)

2.其它四個網頁: (新視窗)

★☆進行上傳☆★

1.上傳首頁檔(index.html)、上傳img資料夾(內含背景圖、圖片)，

上傳到雲端硬碟 www 資料夾。

2.重新與 DRV伺服器連結,點選網址看頁面是否修改成功。

3.請複製網址繳交作業

※如網頁未改變可以按 ctrl+F5 重新整理。

※連網址看到的才是正確的。(成功上傳，網頁可以正確顯示 100 分)

Page updated

Report abuse