您好,歡迎來到HopeTrip旅行網!
|
WeChat我們
關註HopeTrip
關註有好禮
WeChat號:hopetriphk
WeChat名稱:hopetrip旅遊網
| 幫助中心 | 收藏網站 | 線上客服

RWD響應式網頁完全解析

收藏 列印 糾錯 瀏覽次數:0 0人參數
分享到:
 
RWD響應式網頁完全解析
!!RWD響應式網頁完全解析!!

本課程分成兩個階段,前半部分為介紹基礎的網頁基本架構。從最初的HTML和CSS介紹到整個網頁的靜態架構的組成,適合初學者或是觀念還是模糊的學員。 
後半部則是本課程的主要重心:RWD響應式網頁,何謂RWD?為什麼要學RWD?學了RWD有什麼好處!?如果你喜歡網頁設計,歡迎你可以跟我們一起來學最新潮的網頁RWD 

課程重點~ 
Part 1~HTML和CSS (18H) 
★初探HTML: 
1.從草圖到架構 
2.從輪廓到網頁 
3.(P)段落元素 
4.超級長的文字 
5.加入(blockquote) 
6.用(p)元素來列清單 
7.了解巢狀組織的關係 

★CSS概念以及應用: 
1.CSS 概觀 
2.CSS 文字美化 
3.id 與 class 
4.文字間距、行距 
5.各種超連結變色語法 
6.外掛式 CSS 檔案、指定區塊、複合式樣式、CSS 圖形化區塊的應用 
7.(DIV)和(span)的差別 
8.ul and ol來製作選單 
9.position定位 
10.文繞圖float屬性 
11.margin and padding 
12.Box model. 

Part 2~RWD (18H)
★RWD網頁設計基礎: 
1.何謂RWD 
2.RWD優缺點 
3.RWD設計流程 
4.Media Queries使用方法 
5.使用Fluid Grid 
6.Fluid image的設定 

★RWD撰寫前的註意事項: 
1.RWD開發程序 
2.針對行動裝置的考量 
3.瀏覽器的裝置類型 
4.Mobile first 

★RWD開始製作(樣板): 
1.HTML5樣板製作 
2.CSS3樣板製作 
3.多樣版型練習撰寫 

★RWD製作: 
1.頁首設計製作 
2.導覽列設計,製作 
3.內容區的設計製作 
4.頁尾的設計製作 
5.商品一覽頁面設計 
6.輸入表單區的設計製作 
7.照片的輪播效果 
8.整體設計綜合練習 
9.實機測試 
10.模擬器測試 
11.進一步說明實機測試 
12.Chrome Developer Tools 
13.Coda2,IETester,IOS擬器,Androi模擬器

 

 

葉世軒老師 
經歷: 2010第十屆新人王網頁設計比賽佳作 
2011 法務部反毒比賽-影片組佳作 
2010第九屆新人王網頁設計比賽第一名 
2010 「你7了沒!Change & Better !」動畫比賽第三名 
2010 防災宣導短片動畫比賽 佳作 
2010 防制就業歧視四格漫畫徵選比賽 佳作 
2010 全國網頁設計比賽 社會組佳作 
2009第八屆新人王網頁設計比賽評審特別獎 
2006網頁設計比賽社會組人文獎 
2004網頁設計比賽大學組人文獎 
2004hiPage網頁設計大賽佳作 

專案經驗: 
http://www.shoyoung.idv.tw/mizar/ 
http://event.coolermaster.com/life_journey/home/ 
http://www.coolermaster.com/catalog2013/mobile/ 
http://www.coolermaster.com/microsite/haf_xb/ 
http://www.shoyoung.idv.tw/twstory/ 
http://event.cmstorm.com/trigger/ 
http://shoyoung.idv.tw/farmer/ 
http://www.coolermaster.com/microsite/silencio_650/ 
http://shoyoung.idv.tw/flash_book/

[Hopetrip聲明]發表此文不代表同意其說法或描述,僅為提供參考信息。轉載請註明出處。
分享到:
已经输入0个字 我有話要說:
表情
最新點評(0)
更多活動專題推薦
HopeTrip四週年Facebook分享攞特權
HopeTrip四週年邀請賞300
HopeTrip四週年邀請賞300!活動...[詳細]
HopeTrip四週年5折秒殺慶生
HopeTrip四週年5折秒殺慶生!精...[詳細]
HopeTrip四週年3折勁減慶生
HopeTrip四週年3折勁減慶生!Hop...[詳細]
2018聖誕來台北101看浪漫夜景
2018台北公館聖誕季
台北陽明山賞楓攻略2018
2018桃園機場客運巴士交通攻略
台灣七日自由行之遊記+攻略(台北篇)
台北101觀景台門票網絡售價2016
台北101觀景台門票港幣售價2016
北海岸一日遊
台北5日遊行程推薦:愛戀台北
台北101 2018-2019跨年搭捷運實用指南
  • 台北市門票
  • 台北市美食
  • 台北市酒店
  • 台灣通訊
  • 台北市交通
  • 台北市線路
  • 台北市租車
  • 台北市套票
  • 台北市特價
更多
台北101大樓內2018-2019跨年煙火跨年派對門票
市場價:NT$ 5100
NT$ 3400
2016少女時代台北演唱會(5月7日場)
NT$ 6298
2016少女時代台北演唱會(5月8日場)
NT$ 4776
2018-2019台北君悅酒店Grand Hyatt跨年賞101煙火秀派對門票
NT$ 4060
台北民歌41高峰會門票2016(5月15日場)
NT$ 1705
台北王朝大酒店自助吃到飽下午茶餐券
市場價:NT$ 880
NT$ 952
台北萬豪酒店Garden Kitchen主廚炭烤牛排晚餐套餐1客(假日不加價)
NT$ 1295
台北福華大飯店4F花園大道自助吃到飽假日下午茶餐券(+450台幣即可2人享用)
NT$ 920
台北萬豪酒店Garden Kitchen 2人平日週一~週五自助式早餐
NT$ 1295
台中亞緻大飯店28F異料理主菜+自助沙拉吧吃到飽午餐或晚餐券
NT$ 842
士林夜市驛棧2館
市場價:NT$ 0
NT$ 0
驛站旅店
NT$ 0
綠舍輕旅(Green House)
NT$ 0
士林夜市驛棧1館
NT$ 0
長富時尚旅店
NT$ 0
台灣Pocket Wifi租借(台灣機場取件低租低押金)
市場價:NT$ 246
NT$ 205
台灣大哥大10日4G無限上網電話卡(台灣機場取卡)
NT$ 482
台灣遠傳電訊4GWifi蛋租借(各大機場及指定地址取件)
NT$ 250
台灣遠傳無限流量3G上網卡(桃園機場、高雄捷運站取件)
NT$ 442
台北桃園機場Pocket Wifi租借(宅配通加急取件)
NT$ 507
台北-平潭往返船票-海峽號
市場價:NT$ 1702
NT$ 1135
台灣清境到台北車票(台灣觀巴)
NT$ 238
平潭到台北船票-CSF海峽高速
NT$ 569
平潭到台北船票-麗娜號【單程】
NT$ 519
[八折優惠]左營站到台北站-台灣高鐵
NT$ 764
台北野柳+九份老街+十分車站一日遊(含門票、天燈)
市場價:NT$ 952
NT$ 635
台北野柳+九份老街+貓村+十分車站一日遊
NT$ 248
2018台北奧萬大賞楓+九份老街+金瓜石博物館一日遊
NT$ 874
台北陽明山賞楓泡湯半日遊
NT$ 1205
九份到花蓮海岸線一日遊
NT$ 272
【賞楓賞芒花】Taxi tour台北陽明山淡水8小時包車
市場價:NT$ 4357
NT$ 2905
台灣九份平溪一日遊包車
NT$ 5105
北台灣10小時包車(自訂路線)
NT$ 4700
台北桃園機場-台北市區酒店接機24小時服務
NT$ 238
【日間】台灣桃園機場-台北市區包車接機服務
NT$ 1065
台北101觀景台+台北故宮+順益博物館三合一套票(電子票)
市場價:NT$ 1416
NT$ 944
【日間】桃園機場往返台北市区超值套餐(赠上網卡禮包)
NT$ 2290
金廈小三通套票(来回套票)
NT$ 4310
【半日包車限時減$50】台灣台北包車一日遊(自訂路線)
市場價:NT$ 1040
NT$ 835
【21/6,21:00秒殺】台北寒舍艾美探索廚房自助餐(電子票)
NT$ 375
【第二位半價】台北經典三合一景點門票(台北101+台北故宮+順益博物館)
NT$ 185
【雙11瘋搶】北投春天酒店紅檜俱樂部單人健身房+露天游泳池+烤箱+祼湯泡湯券(假日不加價)
NT$ 1475
【28/7,15:00秒殺】台灣高鐵-左營站到台北站(單程票)
NT$ 234