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

Advanced

Re: [作業01] 以HTML與CSS完成第一個網頁

[作業01] 以HTML與CSS完成第一個網頁

1. 參考講義


1.[url=http://mepopedia.com/forum/read.php?804,16668][講義01] 以 HTML 與 CSS 完成第一個網頁[/url]

[hr]

2. 需下載的軟體


FileZilla 免費又好用的FTP軟體,供客戶端和伺服器端使用
官方下載網頁:http://filezilla-project.org/

[hr]

3. 繳交作業的方式



1.以FTP上傳至老師指定位置,每一個作業都會有一個相對應的資料夾
如:[color=#CC3300]第一個作業的資料夾為:hw01[/color]
每位同學請將自己的資料夾命名為:[color=#993300]hw01-學號[/color]
這個作業的網址則為:http://mepopedia.com/~web103-a/hw01/hw01-102xxxxxxx

2.切勿擅改別人的資料檔案,若經發現則以零分計

[hr]

這禮拜請同學按照講義的步驟及做法,自選文字主題。

1.以自己設定的文字內容,字體大小、文字、背景顏色等,盡可能以最具美感的配色與配置為主
做html與css的設定

2.至少兩個可以互相連結的html檔,其中首頁命名為index.html,另一檔案可命名為about.html
3.以及一個命名為style.css的css樣式檔

存放在hw01-學號的資夾內

[IMG]http://i.imgur.com/pUK69i6.jpg[/IMG]

[hr]
並請回覆本篇文章

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-102xxxxxxx

2.有無遇到的問題,製作心得,風格設定與製作作業的時間



4. 參考範例


1.http://mepopedia.com/forum/read.php?1173,24858

2.http://mepopedia.com/forum/read.php?855,15612
3.http://mepopedia.com/forum/read.php?851,15597
4.http://mepopedia.com/forum/read.php?976,20201



Edited 3 time(s). Last edit at 10/08/2014 09:50AM by JinJin.
(編輯記錄)

http://mepopedia.com/~web103-a/hw01/hw01-1025445151

做完Style發現不能至中,點網頁變成全白
以及沒開#main2{導致 about跟index會混再一起

製作時間:8堂課



Edited 1 time(s). Last edit at 10/08/2014 10:03AM by bnn.
(編輯記錄)

http://mepopedia.com/~web103-a/hw01/hw01-1025461015

1025461015



Edited 1 time(s). Last edit at 10/08/2014 09:58AM by 1025461015.
(編輯記錄)

MEPOERs said:
JinJin: 記得修正亂碼問題喔!
http://mepopedia.com/~web103-a/hw01/hw01-1025443064

1025443064



Edited 1 time(s). Last edit at 10/08/2014 09:57AM by 1025443064.
(編輯記錄)

MEPOERs said:
JinJin: 記得修正亂碼問題喔!
作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1005445196

作業心得:對於做網頁來說真的會常常遇到窘境,因為只要稍微出錯就覺得整組壞光光,所以要有很大的耐心跟很細心,之前還不知道要如何修改亂碼時,還以為是我自己做錯了,所以一直重做,後來知道原來是....所以真的花了很久的時間。



學號:1005445196
姓名:張靜怡

MEPOERs said:
JinJin: 加油!持續努力會越來越好!
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1005445193

2.有無遇到的問題,製作心得與製作作業的時間:
很久沒有碰、很多東西都忘記了...但是一步一步跟著做就記起來不少 ^^
可以找自己喜歡的主題做很好玩~

1005445193/徐芯儀

MEPOERs said:
JinJin: 不錯喔!繼續加油!
http://mepopedia.com/~web103-a/hw01/hw01-1025445109

看程式碼感覺像是在看亂碼,看得眼花撩亂,不過最後還是做完了
花了上課時間做完的

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1005445181

2.有無遇到的問題,製作心得,風格設定與製作作業的時間

語法背不起來,css改顏色忘記main的語法,只利用上課的時間修改,和式清新風-早晨篇

1005445181 張嘉偉

http://mepopedia.com/~web103-a/hw01/hw01-1005445189


年紀大,記憶力衰退很快,網頁製作都忘得差不多,不錯的複習機會 ! !

http://mepopedia.com/~web103-a/hw01/hw01-1025445073
第一次做網頁所以很不熟
也很挫敗
讓我頭昏眼花

MEPOERs said:
JinJin: 加油!其實還不錯,只是首頁要改為 index.html
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445205

2.有無遇到的問題:呵呵

1025445205 陳梵雯



Edited 2 time(s). Last edit at 10/08/2014 10:04AM by 衛生綿.
(編輯記錄)

MEPOERs said:
JinJin: 很會舉一反三喔!
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445043

2.有無遇到的問題,製作心得,風格設定與製作作業的時間

About的body背景色不會更改

1025445043金家任



Edited 1 time(s). Last edit at 10/08/2014 10:06AM by 1025445043.
(編輯記錄)

MEPOERs said:
JinJin: body背景色,可以以外包另一DIV或不同CSS檔案來製作
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445103

2.有無遇到的問題,製作時間太長,有點困難

1025445103-張秀安

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445223

2.有無遇到的問題:很多

製作心得:我這輩子應該和網頁設計無緣【眼神死

MEPOERs said:
JinJin: 還是要繼續加油啦!!! 1.要記得設padding 2.第二要補內容和連結喔! 加油!
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445124

2.有無遇到的問題,製作心得,風格設定與製作作業的時間 : 被語法弄得很混亂,多看幾次就懂了

MEPOERs said:
JinJin: 沒看到你的檔案喔!
1025445124: 檔案被傳錯的同學覆蓋掉了 已經補上
網址:
http://mepopedia.com/~web103-a/hw01/hw01-1025445082/

有無遇到的問題,製作心得,風格設定與製作作業的時間 :
全部都是問題,在CSS那邊卡很久,課堂上靠講義及老師解惑,製作時間8堂課。

學號:1025445082

MEPOERs said:
JinJin: 不錯喔!繼續加油!
http://mepopedia.com/~web103-a/hw01/hw01-1025445058

1025445058-楊舒涵

http://mepopedia.com/~web103-a/hw01/hw01-1025445202

覺得語法很多很複雜,短時間很難記得,而且只能在上課時間練習

1025445202 林彥希



Edited 1 time(s). Last edit at 10/14/2014 05:57PM by 林彥希.
(編輯記錄)

MEPOERs said:
JinJin: 可以試著設定字間 line-hieght ,回去也要多練習喔!
1.作業網址: http://mepopedia.com/~web103-a/hw01/hw01-1025445181

2.有無遇到的問題,製作心得,風格設定與製作作業的時間:
我覺得蠻難的,內容太多吸收不了,語法很多很複雜



Edited 1 time(s). Last edit at 10/08/2014 12:44PM by 1025445181.
(編輯記錄)

MEPOERs said:
JinJin: 多練習幾次應該會越來越好,加油! 一樣是可以加字間語法喔!
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445130

2.打得很混亂...

MEPOERs said:
JinJin: 其實還OK的~加油!
http://mepopedia.com/~web103-a/hw01/hw01-1025445160

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-102445184

2.有無遇到的問題,製作心得,風格設定與製作作業的時間

陳薏茹

MEPOERs said:
JinJin: 找不到檔案喔!
http://mepopedia.com/~web103-a/hw01/hw01-1025445049/index.html

心得: 沒遇到甚麼問題,第一次接觸網頁設計,很喜歡,覺得很有趣。

1025445049 余沛綾

MEPOERs said:
JinJin: 不錯喔!繼續加油!
[size=small]1.http://mepopedia.com/~web103-a/hw01/hw01-1025445001
2.語法還未熟悉,不過可以自己架網站很有趣。

1025445001 蘇柔羽[/size]

MEPOERs said:
JinJin: 可再設定字間會更好喔!加油!
http://mepopedia.com/~web103-a/hw01/hw01-1025445133
有無遇到的問題 : 最大的問題是亂碼,不過現在已經知道怎麼解決了。
製作心得 : 目前網頁設計跟真正能給人瀏覽的比起來,還算是簡單的,期待我之後能學會如何製作那樣的網頁。
風格設定 : 淡雅風
製作作業的時間 : 大約8小時

1025445133 林哲立

MEPOERs said:
JinJin: 配色要再加油喔!
1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445046

2.有無遇到的問題,製作心得,風格設定與製作作業的時間:
遇到很大的問題,一開始製作都一直出現亂碼,重複檢查了很多遍還是找不到原因,
所以覺得特別難,但經過今天老師重新指導,成功後,突然覺得簡單了很多,只是有
點複雜,總共製作6堂課的時間外加課外4小時。

視傳二A 1025445046

MEPOERs said:
JinJin: 繼續加油囉!!!
http://mepopedia.com/~web103-a/hw01/hw01-1025445178/

遇到的困難: 忘記把about屬性改成繁體中文了要再重新上傳
,因為是第一次做很多語法(像是更改背景顏色,字體間距,會忘記不知道怎麼改
但是有學姊的幫忙,就做得比較順,老師也很有耐心講XD不然真的很gg ~~

1025445178 張祐寧



Edited 1 time(s). Last edit at 10/09/2014 09:51PM by yo.nin.
(編輯記錄)

MEPOERs said:
JinJin: 要記得連到下一頁的連結喔!!加油!
視傳二A 1025445064 葉芷妤
http://mepopedia.com/~web103-a/hw01/hw01-1025445064

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445070

2.有時候會搞不懂哪個語法是做什麼,也都還不熟悉,但可以做出一個自己的網站感覺很新鮮。

1025445070 邱薏如

http://mepopedia.com/~web103-a/hw01/hw01-1025445067
有時後按照順序作,卻不會出現我要的東西,然後就在那邊一直亂試,可能自己還是不太了解吧
8h
1025445067 黃筱軒

MEPOERs said:
JinJin: 其實還OK的~加油!
http://mepopedia.com/~web103-a/hw01/hw01-1025445139/

語法很容易忘記,不太熟悉,不過還好有咕狗大神,嘗試性的放了張圖片。

1025445139呂鍰慈

MEPOERs said:
JinJin: 可以試著padding再多一點!加油!
http://mepopedia.com/~web103-a/hw01/hw01-1025445169
剛開始我覺得很困難,由其是背景色塊那裡
1025445169 古佳綺



Edited 2 time(s). Last edit at 10/13/2014 03:39PM by chia chi.
(編輯記錄)

http://mepopedia.com/~web103-a/hw01/hw01-1025445061/about.html

覺得放連結很困難

1025445061王靖雅



Edited 2 time(s). Last edit at 10/14/2014 02:46PM by 1025445061.
(編輯記錄)

MEPOERs said:
JinJin: 找不到檔案喔!
作業網址 : http://mepopedia.com/~web103-a/hw01/hw01-1025445040

製作心得 : 背景一直搞不出來,都快要快發瘋了!幸好有老師幫忙,才發現我少用一個語法,
自己做出來的網頁看了很開心!!
風格設定 : 清晰明亮

製作時間 : 共2小時

(背景要用Google開才看得到)



Edited 1 time(s). Last edit at 10/14/2014 10:12PM by MoMi.
(編輯記錄)

MEPOERs said:
JinJin: 哈!繼續加油喔!!!
http://mepopedia.com/~web103-a/hw01/hw01-1025445148

心得:最下方的相關連結與回首頁,一直無法與網頁內容一起顯示在預定的框框底色內,請老師來指導,馬上找出原因,因為沒有放在body內,才會一直顯示在外面!
網頁的步驟對於還不熟悉的我們來說,很繁雜,一個步驟沒跟上就很麻煩!我是屬於學比較慢的,所以盡量在課堂中把進度達成!


1025445148盧姿穎

http://mepopedia.com/~web103-a/hw01/hw01-1025445055/
1.遇到的問題:背景圖片一直抓不到...
2.設定的風格:明確
1025445055 許淑雯

http://mepopedia.com/~web103-a/hw01/hw01-1025445136
很期待下次的網頁能放圖進去,還是html好,會別上學期選修php的陰霾
1025445136 劉志彥

http://mepopedia.com/~web103-a/hw01/hw01-1025445010/
1.遇到的問題:很多小地方都要很細心地去做
2.設定的風格:簡單
1025445010 謝佳蓁

http://mepopedia.com/~web103-a/hw01/hw01-1025445184


1025445184-陳薏茹

http://mepopedia.com/~web103-a/hw01/hw01-1025445085

覺得網頁設計是一個很可怕的東西,只要漏了一個後面就都不會了,因為我電腦不好,所以很認真地聽,雖然遇到很多問題,幸好有老師學姊朋友幫我,讓我交的出來作業~哈哈,其實我覺得只要商課有專心跟著老師的腳步走,就一定跟得上!(教得很簡單)

1025445085楊婷淵

http://mepopedia.com/~web103-a/hw01/hw01-1025445112
我覺得都很難,不過很有趣。
學會了感覺很厲害

1.作業網址: http://mepopedia.com/~web103-a/hw01/hw01-1025445079/
2.有無遇到的問題:一開始很順,從存檔開始就一堆問題.................

p.s google chrome跑不出來 IE可以= =

學號:1025445079



Edited 2 time(s). Last edit at 10/15/2014 10:11AM by iamve.
(編輯記錄)

http://mepopedia.com/~web103-a/hw01/hw01-1025445175
心得:
高中時就有做過網頁設計了 但是是第一次接觸Dreamweaver
網頁設計對我來說是屬於比較困難的課程 但就是因為困難才有學的價值
希望能越來越進步

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445091

2.有無遇到的問題:對語法不太熟悉

http://mepopedia.com/~web103-a/hw01/hw01-1025445031


視傳2A1025445031

http://mepopedia.com/~web103-a/hw01/hw01-1025445127

1025445127

file:///C:/Users/fan%20fan/Desktop/hw01-1025445187/index.html

1025445187

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445037

2.作業心得:程式碼有點難記!

1025445037 莊曜丞

1.作業網址::http://mepopedia.com/~web103-a/hw01/hw01-1025445061

2.作業心得: 教學很快, 色塊很難

1025445061王靖雅

MEPOERs said:
JinJin: 有問題可以隨時提出來唷~加油!!! 內容記得要分段!
作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445199

作業心得:有時候語法多到都會亂掉,還會出現一堆亂碼,還好有問題可以解決。



1025445199 萬欣穎

作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445106/about.html

作業心得:要背很多的程式碼的有點困難,而且有時候會跑出亂碼,不過做完的成就感很好

莊淑芳1025445106

http://mepopedia.com/~web103-a/hw01/hw01-1025445100

心得:雖然語法很難而且試了很多次才成功,但經過一次又一次的試驗與練習,也慢慢熟悉了解,能學習新的軟體讓人很開心.

1025445100 葉芳羽

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445103

2.有無遇到的問題,製作時間太長

1025445103-張秀安

1.作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445097

2.有無遇到的問題:覺得語法太複雜

1025445097陳慶芳

作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445076

遇到問題:跳出亂碼.很多不會的


1025445076 葉珈妤

http://mepopedia.com/~web103-a/hw01/hw01-1025445115

有時會做到錯亂,style我不怎麼會用,有點難。
然後,我連線連好久,終於來了! 能交功課了。

1025445115 蔡鈺均

作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445025/about.html

作業心得:一切順利



1025445025 許函郁

http://mepopedia.com/~web103-a/hw01/hw01-1005445195/

做自己喜歡的主題就覺得很有趣
1005445195 黃沛容

作業網址:http://mepopedia.com/~web103-a/hw01/hw01-1025445163

非常困難

學號:1005445163

http://mepopedia.com/~web103-a/hw01/hw01-1025445190

1025445190

http://mepopedia.com/~web103-a/hw01/hw01-1025445217
操作真難
二小時快瘋了