張凱迪(KD Chang)
台灣大學，主修經濟學，臺大資管所。服務過上市電子公司、人工智慧新創公司、全球前三大瀏覽器製造商和電子商務平台，也曾參與數個組織的創辦。夢想是做出人們想用的產品和辦一所心目中理想的學校。
CSS FrameworkS
現代化行動網頁設計基礎入門班 DAY 6
講師：張凱迪（KD.Chang）
Copyright © 2013 All rights reserved
提醒您鍵盤左右鍵可以移動投影片
Sorry, PPT is not suitable for Hackers : (
Outline
CSS Framework 簡介
Twitter Bootstrap 實戰
關於 CSS Framework 那些小事
CSS Framework 簡介
CSS FRAMEWORK 是啥？
將常用的CSS整理歸納好(元件、排版布局)，並在需要時直接載入所需要的設定，透過這個方法可以大幅提昇工作效率及節省在相似或相同設定上所花費的時間，讓開發者可以專注在應用開發上
有哪些 CSS FRAMEWORK？
常見有Twitter Bootstrap、Foundation、Gumby Framework
Twitter Bootstrap 實戰
TWITTER BOOTSTRAP 3
網格系統(GRID SYSTEM)
網格系統(Grid System)
目前有4種Grids，為不同裝置而設：
.col-xs-*：智慧型手機 ( <768px )
.col-sm-*：平板 ( ≥768px )
.col-md-*：桌上型電腦 ( ≥992px )
.col-lg-*：桌上型電腦 ( ≥1200px )
實戰練習
使用Twitter Bootstrap做出可跨瀏覽器瀏覽的Mobile Web
Twitter Bootstrap 與 CSS Framework簡介
By 張凱迪(KD Chang)
Twitter Bootstrap 與 CSS Framework簡介
隨著智慧型裝置的起飛，現在幾乎已是人手一支智慧型手機，根據統計今年全球智慧型手機出貨量已達10億支，由於大量的需求，開發Mobile Web也成為原生（Native App）外另一種較低成本的選擇。因此本課程將著重在網頁開發基礎介紹以及如何運用HTML5/CSS3/JavaScript（jQuery）來開發Mobile Web App。希望讓沒有基礎（或有基礎）的學員能在學習完課程後具備自學能力未來能持續進修，進而開發出搭配Facebook API、Google Map API的Mobile Web App。 課程網站：http://kdchang.cc/mobile-web-dev/
