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

Advanced

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

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

請參考

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


本講義範例網址
http://mepopedia.com/~jinjin/web/hw07/



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

1. 一、製作步驟


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

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

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

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

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

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




7.在title的部分打上『自己作業的命名』

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

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

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

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





2. 二、繳交作業方式



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

第七個平時作業FTP上的資料夾為:hw07

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

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

存放在 < hw07-學號 > 的資夾內



2.上傳至FTP

3.回覆本篇文章

(1).作業網址 :

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







Edited 1 time(s). Last edit at 12/10/2012 12:35AM by JinJin.
(編輯記錄)

Attachments:
開啟 | 下載 - hw07-ex.rar (148.5 KB)
http://mepopedia.com/~web101c/hw07/hw07-1015445243
1.網頁主題: 配色與風格設定: 金黃色系
2.有無遇到的問題? 無問題
3.製作感想 :拿之前做的作業就好了~~再做新的話會被公幹XDD
4.製作作業的時間 :忘了XDD

MEPOERs said:
JinJin: OH!其實做網頁要有精益求精的精神的!加油!!!XD
(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445242

(2).請回答以下問題:
1.網頁主題:Hello Kitty 配色與風格設定:粉白簡約
2.有無遇到的問題? 無
3.製作感想:為自己喜歡的東西做很特別
4.製作作業的時間:幾小時

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445234


(2).請回答以下問題:
1.網頁主題: 配色與風格設定:粉紫色
2.有無遇到的問題? 無
3.製作感想: 繼續做下去完成期末作業
4.製作作業的時間 :3小時

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445246


(2).請回答以下問題:
1.網頁主題: 配色與風格設定:以聖誕節為主題,紅色佔大多數,在寒冷的冬天,看到紅色,能夠溫暖人的心,具有舒服、放鬆的感覺,所以選擇紅色為主色
2.有無遇到的問題? 小標題每次設定都會消失上一段文章,content、角色介紹那裏都有,所以不知怎麼辦
3.製作感想: 學習的很愉快,學到許多技巧,感謝老師!!
4.製作作業的時間 :分好幾天做加起來大約有5小時吧~~

MEPOERs said:
JinJin: 你CSS檔案的聯結有誤,是指向你的電腦,要改喔!不然效果會出不來!加油!
(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445215


(2).請回答以下問題:
1.網頁主題:Green Day。
配色與風格設定:複古,紅、黑。
2.有無遇到的問題? 無。
3.製作感想: 有點小複雜,不過作完很有成就感,繼續朝向期末作業努力中。
4.製作作業的時間 :不到一天。

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445203

(2).請回答以下問題:
1.網頁主題: 仁顯王后的男人
配色與風格設定:紫色與藍色,呈現浪漫的感覺
2.有無遇到的問題? 沒有
3.製作感想:延續到期末的作業感覺很開心,仁顯王后的男人真的太讓我喜愛了哈哈
4.製作作業的時間:一天

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445213


(2).請回答以下問題:
1.網頁主題: 配色與風格設定:黑白色
2.有無遇到的問題? 無
3.製作感想: 使用方面更方便
4.製作作業的時間 :課堂時間

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445240

(2).請回答以下問題:
1.網頁主題:少年魔法師梅林 配色與風格設定:黑灰色系
2.有無遇到的問題? 無
3.製作感想 很開心做完了,又學到了很多
4.製作作業的時間 半天

http://mepopedia.com/~web101c/hw07/hw07-1015445232
1.網頁主題: 配色與風格設定: 黑白粉
2.有無遇到的問題? 無
3.製作感想 :問題自己慢慢研究,就能解決了
4.製作作業的時間 : 1天多

http://mepopedia.com/~web101c/hw07/hw07-1015445208
1.網頁主題: 初音未來
配色與風格設定: 黑、藍色系
2.有無遇到的問題? 以解決
3.製作感想 :好累做好久,內容做好多
4.製作作業的時間 :2天



Edited 1 time(s). Last edit at 12/29/2012 05:20PM by 1015445208.
(編輯記錄)

1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445221

(2).請回答以下問題:
1.網頁主題: 配色與風格設定:青春健康配色
2.有無遇到的問題? 因為套用表格導致偏出去
3.製作感想 做出來了開心,學到更多
4.製作作業的時間 好幾天

(1).作業網址:http://mepopedia.com/~web101c/hw07/hw07-1015445270

(2).請回答以下問題:
1.網頁主題:史努比sonnpy
配色與風格設定: 橘、白,灰
2.有無遇到的問題:還好
3.製作感想 :終於又完成了一頁
4.製作作業的時間:1.5小時

作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445225/


1.網頁主題:貝果
配色與風格設定:黃色調!歐普風
2.有無遇到的問題? = =太多ㄌ!
3.製作感想:除了gg還是gg
4.製作作業的時間:1天

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445207

(2).請回答以下問題:
1.網頁主題: 芋園柚子
配色與風格設定:黃色調.黑白調
2.有無遇到的問題? 最右邊那出現文字亂跑!!!
3.製作感想: 做到快G了~但終於做好了!!!!!終於阿!!!
4.製作作業的時間 :2小時

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445228


(2).請回答以下問題:
1.網頁主題:雨月
配色與風格設定:藍綠色調
2.有無遇到的問題? 有,表格溝通不良 ....
3.製作感想: 希望能完成期末作業
4.製作作業的時間 :不可計(?

http://mepopedia.com/~web101c/hw07/hw07-1015445239
1.網頁主題: 配色與風格設定: 紅白
2.有無遇到的問題? 無問題
3.製作感想 :拿做好的期末作業!
4.製作作業的時間 : 一天吧

(1).作業網址 :
http://mepopedia.com/~web101c/hw07/hw07-1015445201

(2).請回答以下問題:
1.網頁主題:Avril Lavigne
配色與風格設定:綠、灰、黑
2.有無遇到的問題? 還好
3.製作感想 :一直有遇到些小問題,最後都解決了,能做出來很開心,學到很多。
4.製作作業的時間:一天以上

http://mepopedia.com/~web101c/hw07/hw07-1015445218
1.網頁主題:rody
配色與風格設定:可愛的顏色
2.有無遇到的問題? 沒有
3.製作感想 :連期末作業都做完囉~
4.製作作業的時間 :一天

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445231

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

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445206


(2).請回答以下問題:
1.網頁主題: 配色與風格設定:粉紅 粉紫
2.有無遇到的問題? 不會設float
3.製作感想 好煩歐~~~都不太會confused smiley
4.製作作業的時間 兩天



Edited 1 time(s). Last edit at 01/06/2013 08:05PM by 1015445206.
(編輯記錄)

http://mepopedia.com/~web101c/hw07/hw07-1015445202

1.網頁主題:魔髮奇緣
配色與風格設定: 黑白色系
2.有無遇到的問題? 無
3.製作感想 很有成就感
4.製作作業的時間 :兩天

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445241

(2).請回答以下問題:
1.網頁主題: 配色與風格設定: 色塊與圖片
2.有無遇到的問題? 重新命名表格monent沒做好像沒什麼關西?
3.製作感想 好累.照著講議一步一步作
4.製作作業的時間 3HR

(1).作業網址 :http://mepopedia.com/~web101c/hw07/hw07-1015445222


(2).請回答以下問題:
1.網頁主題: 配色與風格設定:紅.黑.白.灰
2.有無遇到的問題? 按扭連結有點忘記了
3.製作感想: 我爆肝了ya~~~~~~~~~~~~~~~~
4.製作作業的時間 :天荒地老

(1).作業網址 :
http://mepopedia.com/~web101c/hw07/hw07-1015445223

(2).請回答以下問題:
1.網頁主題:舞力全開
配色與風格設定:綠、灰、黑
2.有無遇到的問題? 有
3.製作感想 :一直有遇到些小問題,要一直請教別人 但後來也有搞懂
4.製作作業的時間:一天以上

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445245

(2).請回答以下問題:
1.網頁主題: 配色與風格設定: 可愛的維尼
2.有無遇到的問題? 很多,但是都已經解決了
3.製作感想 很開心,我學到了很多
4.製作作業的時間 快6天

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445257/

(2).請回答以下問題:
1.網頁主題:棉花糖 配色與風格設定:簡單風 黃綠粉紅
2.有無遇到的問題? 表格寬度
3.製作感想:能夠完成之前做的東西 很開心
4.製作作業的時間:幾小時

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445212

(2).請回答以下問題:
1.網頁主題:玩具總動員 
配色與風格設定:兒童玩具
2.有無遇到的問題? 有
3.製作感想:為自己喜歡的東西做然後很開心也很有成就感
4.製作作業的時間:三四小時
eye rolling smiley

http://mepopedia.com/~web101c/hw07/hw07-1015445219
1.網頁主題:飛哥與小佛
配色與風格設定:藍色系 簡單明瞭 飛哥與小佛風格
2.有無遇到的問題? 做的時候要很小心
3.製作感想 :做完真的是太開心了smileys with beer
4.製作作業的時間 :兩天

(1).作業網址 :
http://mepopedia.com/~web101c/final/final-1015445224

(2).請回答以下問題:
1.網頁主題:The Script
配色與風格設定:黑白,極簡主義
2.有無遇到的問題? 有
3.製作感想:能自己喜歡的樂團心情很好,做起來也特別順利
4.製作作業的時間:一天

1015445262期末作業07

(1).作業網址 : http://mepopedia.com/~web101c/hw07/hw07-1015445262

(2).請回答以下問題:
1.網頁主題: 配色與風格設定: 粉白藍
2.有無遇到的問題? : 有 我根本亂了腳步 幸好我有流下來請教老師我不會的地方
3.製作感想 :我真的覺得網頁好難 他的語法制作過程也很難 但是每次只要做完就會覺得其實沒那麼糟
4.製作作業的時間 三天