Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

Re: [作業07] 以Float:浮動,製作雙欄網頁

[作業07] 以Float:浮動,製作雙欄網頁

請參考

[color=#CC3300][講義07] 以Float:浮動,製作雙欄網頁
http://mepopedia.com/forum/read.php?804,18255[/color]


[color=#CC0066]本講義範例網址
http://mepopedia.com/~jinjin/web/hw07/[/color]


的步驟製作,並符合以下條件:

1. 一、製作步驟


1.下載附件的練習檔(或直接由期末作業方式製作,但必須是全新的內容的一頁,不要與範例內容相同)

2.找文字及圖片資料,並設定#header的標題與副標題

3.重新設定#content及#footer的CSS

4.在#content中插入#content-L及#content-R利用Float:浮動屬性,製作雙欄網頁。

5.在#content-L放入垂直檔覽列。

6.將#content-R的資料以表格整理,複習表格的做法。

[hr]

7.在[color=#990033]title的部分打上『自己作業的命名』[/color]

8.在#footer打上自己的版權聲明

9.請每位同學依步驟完成本單元後,上傳至FTP

10.本次作業的重點在於:

[color=#CC0066](1 )認識多欄網頁。
(2 )雙欄網頁製作
(3 )製作垂直導覽列
(4 )複習表格的做法
(5 )利用CSS,做更細緻的網頁美化設定。 ([/color]


[hr]

2. 二、繳交作業方式



1.製作完成後,檔案命名方式:

[color=#669900]第七個平時作業FTP上的資料夾為:hw07

每位同學請將自己的資料夾命名為:hw07-學號
這個作業的網址則為:http://mepopedia.com/~web104-2c/hw07/hw07-103xxxxxxx

資料夾內含:
1.首頁命名為index.html
2.一個命名為style.css的css樣式檔
3.images圖檔資料夾

存放在 < hw07-學號 > 的資夾內[/color]


2.上傳至FTP

3.回覆本篇文章

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-103xxxxxxx

(2).請回答以下問題:
1.網頁主題: 配色與風格設定:
2.有無遇到的問題?
3.製作感想
4.製作作業的時間



[hr]

3. 上課影音


以Float:浮動,製作雙欄網頁 雙欄Float:浮動、Table:表格、錨點、垂直導覽列
http://youtu.be/pj6f8GQKIu8




2.作業參考
(1) http://mepopedia.com/~jinjin/web/hw07/
(2) http://mepopedia.com/~web103-a/hw07/hw07-1005445193/
(3) http://mepopedia.com/~web103-a/hw07/hw07-1025445139/team.html
(4) http://mepopedia.com/~web103-a/hw07/hw07-1005445195/
(5) http://mepopedia.com/~web103-a/hw07/hw07-1025445001/album.html
(6) http://mepopedia.com/~web103-a/hw07/hw07-1025445040/



Edited 1 time(s). Last edit at 12/17/2015 08:26PM by JinJin.
(編輯記錄)

2.上傳至FTP

3.回覆本篇文章

(1).作業網址 :http://mepopedia.com/~web104-2a/hw07/hw07-1035445066

(2).請回答以下問題:
[size=x-large]陳浩田上課一直吵白目[/size]

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445171/

(2).請回答以下問題:
1.網頁主題: 配色與風格設定:森林
2.有無遇到的問題? 表格一直跳掉 超煩
3.製作感想:標籤太多好亂
4.製作作業的時間:3小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445054

(2).請回答以下問題:
1.網頁主題: BIGBANG 配色與風格設定: 黑白
2.有無遇到的問題? 沒有
3.製作感想 有點累
4.製作作業的時間 2小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445147

(2).請回答以下問題:
1.網頁主題: 灌籃高手
2.有無遇到的問題? 沒有
3.製作感想 困難重重
4.製作作業的時間 3小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445078

(2).請回答以下問題:
1.網頁主題: 珍遊記
2.有無遇到的問題? 學習障礙
3.製作感想 我智商太高
4.製作作業的時間 24小時

1005445160 - 王思博

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1005445160/

(2).請回答以下問題:

1.網頁主題:Family Guy
2.配色與風格設定: 舒適的
3.有無遇到的問題: 還好
4.製作感想:做完就能放鬆了
5.製作作業的時間:幾小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445123

(2).請回答以下問題:

1.網頁主題:黑白色調的馬來貘

2.有無遇到的問題? 有喔 一堆

3.製作感想: 非常疲憊

4.製作作業的時間: 久到數不清

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445108

(2).請回答以下問題:
1.網頁主題: LOL
配色與風格設定: 暗色調
2.有無遇到的問題? 沒有
3.製作感想 難
4.製作作業的時間 1小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445102

(2).請回答以下問題:
1.網頁主題:奈良美智 配色與風格設定: 溫暖舒服的
2.有無遇到的問題? 沒有
3.製作感想 有成就感
4.製作作業的時間 6個小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445129

(2).請回答以下問題:

1.網頁主題:小鼠波波 配色與風格設定:以鮮豔的色彩吸引兒童觀看

2.有無遇到的問題:無,看教學影片學習

3.製作感想:網頁要認真學習,才有收穫

4.製作作業的時間:3小時

學號:1035445129

(1).作業網址: http://mepopedia.com/~web104-2c/hw07/hw07-1035445063
(2).請回答以下問題:
1.網頁主題:植物VS殭屍花園戰爭
2.有無遇到的問題:一切順利
3.製作感想:做完了很開心
4.製作作業的時間: 兩~三小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445006

(2).請回答以下問題:

1.網頁主題:粉紅豬小妹。
配色與風格設定:柔和、曖昧不搶眼的色調以舒服為主。

2.有無遇到的問題:無,教學影片都有詳解。
3.製作感想:漸漸熟悉網頁設計這個詞了,但有些專業術語仍在用心記。

4.製作作業的時間:3小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445189/

(2).請回答以下問題:
1.網頁主題: 醜筆頭
2.有無遇到的問題? 無
3.製作感想:剛開始有點搞不清楚,還好有老師的教學影片,才可以比較快完成
4.製作作業的時間:2小時

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445153

(2).請回答以下問題:
1.網頁主題:薰衣草 配色與風格設定:以紫色調為主
2.有無遇到的問題? 無
3.製作感想:一步一步照著講義,做所以沒有問題
4.製作作業的時間:2小時半

(1).作業網址 :http://mepopedia.com/~web104-2c/hw07/hw07-1035445087

(2).請回答以下問題:
1.網頁主題: 配色與風格設定: 詭異的灰紫色
2.有無遇到的問題? 圖檔太大蓋住標題
3.製作感想 還行,我換個主題了
4.製作作業的時間 一小時