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

Advanced

[作業09] 網頁探索-切版練習與HTML+CSS設計

1. 參考講義


網頁探索-切版練習與HTML+CSS設計
JUDE WANG編輯
http://cute.jude.asia/week-1/

講義整理
http://mepopedia.com/forum/read.php?804,46755



2. 作業


可以選擇其中一種製作,或每種都製作



1. 切版練習


檔案下載 http://d.pr/f/iqrv
切版雖然是較舊的技術,但仍然是必學的技術之一,可應用於較小型或個人的網站
製作完成後請上傳至hw09資料夾中,資料夾請命名為:hw09-1-學號

並請回覆
(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-學號
(2)製作心得:

2. CssZenGarden CSS編輯與設計


HTML檔案http://www.csszengarden.com/examples/index
CSS檔案http://www.csszengarden.com/examples/style.css
建議可使用
http://www.sublimetext.com/3
編輯程式碼
製作完成後請上傳至hw09資料夾中,資料夾請命名為:hw09-2-學號

並請回覆
(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-2-學號
(2)製作心得:

3. PSD 2 HTML


預習與練習
下回介紹
http://blog.spoongraphics.co.uk/tutorials/how-to-create-a-sleek-grid-based-website-design
http://line25.com/tutorials/create-a-grid-based-web-design-in-html5-css3



Edited 4 time(s). Last edit at 05/27/2014 02:42PM by JinJin.
(編輯記錄)

切版 http://mepopedia.com/~web102-a/hw09/hw09-1-1015445006/Crafted_template.html

製作心得: 覺得網頁沒想到可以用這麼簡單的方式來做,只要改一改,用一用連結就可,就覺得好方便喔~~以前都不知道可以這樣做!!!
真的很酷拉拉~~~
有一些圖片有改過喲!!~和一些連結也可連進去喔,還有字也從英文改成中文囉!!~



Edited 2 time(s). Last edit at 05/26/2014 10:24PM by 蘭雅涵.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-1015445050/Crafted_template
(2)製作心得: 雖然以前有學過類似的但這次教得好像比較迅速也蠻方便的。只連了一些網站...

(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-1015445024/Crafted_template
(2)製作心得:連結以最上面第一個(HOME)連結至google.com做範例。



Edited 1 time(s). Last edit at 05/26/2014 10:31PM by lin yi.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-1015445012/Crafted_template
(2)製作心得:沒有想到做一個網頁可以這麼快的就完成了!真得很神奇,但是感覺滿陽春的XD


(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-1015445039/home.html
(2)製作心得: 只改了home,HTML裡夾了好多東西看了好討厭阿!!!很久沒碰DW的感覺好陌生。

作業二是..
http://i.imgur.com/6YRJoS3.png
yay




Edited 2 time(s). Last edit at 05/27/2014 02:52AM by 金桔.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-1015445035/home.html
(2)製作心得:原來還有這招...以前沒學過哈哈...好像還不錯用~

(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1015445001/home_01.html
(2)製作心得:快速的製作網頁~做第一個連結及圖片

(1)作業網址:http://mepopedia.com/~web102-a/hw09/hw09-1-1015445051/Crafted_template.html
(2)製作心得:



Edited 1 time(s). Last edit at 06/05/2014 07:57PM by usa200ps.
(編輯記錄)

(1)作業網址:C:\Users\Acer\Desktop\hw09-1015445015\Untitled-1.html
(2)製作心得: 記得以前有學過類似這樣的網頁製作,而這次用切版的方式好像更快更方便了。

學號1015445015

MEPOERs said:
JinJin: 網址有誤