優勢多媒體前端互動設計 - RWD_1

響應式網頁設計

Responsive Web Design
  • 時數:24小時
  • 費用:NT$ 12,000
  • 點數:3.5

選擇查詢分區開課時間

地點 班號 日期 時間 報名
台北 24941 班 2024/03/30 ~ 2024/04/14 每週六日 09:00~16:00 報名
台北 652 班 2024/05/13 ~ 2024/05/16 每週一二三四五 09:00~16:00 報名
台北 653 班 2024/07/01 ~ 2024/07/04 每週一二三四五 09:00~16:00 報名

目前查無開課時段

詳細開課時間請洽詢業務
新竹、台中、高雄如有上課需求,請參考台北開課日期,洽當地服務人員依需求加開遠距開課日期

聯絡恆逸

教材

優勢精選教材

課程目標

關於響應式網頁,簡單的來說是讓網站可以直接自動針對不同設備(桌機、筆電、平版、手機)等不同尺寸螢幕瀏覽網頁時,整個網頁頁面會對應不同的解析度,而有不同的內容呈現方式。在這樣的趨勢之下,Responsive Web Design響應式網頁設計將是未來網站設計的基本需求。 響應式網頁設計(Responsive Web Design)其背後需要的技術是【CSS】、【HTML5】、【JavaScript】,為了讓非程式開發的設計師也能快速開發設計響應式網頁,課程先使用Dreamweaver的CSS 3與Bootstrap的相關程式碼編輯功能,從中有效率了解響應式網頁規則與架構,因此就算無程式基礎也能順利表現出完整度、互動性更高的響應式網站,跟上目前業界網站設計流行動脈。課程中也著重程式碼的理解與培養,最後會以Visual Studio Code編輯響應式網頁,以利往後職場上能與程式設計師溝通合作,更能不斷自我提升專業能力。

適合對象

需有HTML與CSS基礎,欲學習響應式網頁設計的設計師

課程內容

  1. 關於響應式網頁設計

    • 1-1 什麼是響應式網頁
    • 1-2 響應式網頁設計趨勢
    • 1-3 響應式網頁的構成
  2. 使用Bootstrap打造響應式網頁內容

    • 2-1 Bootstrap通用類別
    • 2-1-1 文字顏色與背景色
    • 2-1-2 文字屬性
    • 2-1-3 標題
    • 2-1-4 顯示標題
    • 2-1-5 邊界與內距屬性設定
    • 2-1-6 表格(Table)
    • 2-1-7 圖片區(Figures)與圓角
    • 2-1-8 邊框(Borders)
    • 2-1-9 浮動 (float)

    • 2-2 Bootstrap元件素材

    • 2-2-1 標籤 (Badge)
    • 2-2-2按鈕 (Buttons)
    • 2-2-3麵包屑 (Breadcrumb)
    • 2-2-4折疊切換內容 (Accordion)
    • 2-2-5標籤切換內容(Tab)
    • 2-2-6圖片(Responsive image)
    • 2-2-7廣告大屏幕 (Jumbotron)
    • 2-2-8多媒體物件(Media Object)
    • 2-2-9內嵌 (Embeds)

    • 2-3 Bootstrap響應式導覽列

    • 2-3-1基本型收合導覽按鈕
    • 2-3-2包含彈出選單的導覽按鈕列
    • 2-3-3 其他導覽列功能

    • 2-4 Card與Carousel應用

    • 2-4-1 卡片應用
    • 2-4-2 圖文框排列版面
    • 2-4-3圖文內頁編排
    • 2-4-4滑動圖片版型
    • 2-4-5 滿版大圖滑動控制板型
    • 2-4-6 圖片內容版面
  3. Bootstrap元件素材

    • 3-1 按鈕控制單頁捲動版型
    • 3-2 側邊收合按鈕的單頁捲動版型
    • 3-3 單頁捲動版型應用
    • 3-4 單頁捲動版型與互動效果
  4. Bootstrap內容編排組件應用

    • 4-1下載安裝Visual Studio Code
    • 4-2安裝擴充套件才能順利開始
    • 4-3使用VS Code跟程式開發一起製作響應式網頁
  5. 響應式網頁實作

學會技能

  1. 清楚了解Bootstrap 組件功能與使用技巧
  2. 能獨立完成響應式網頁
  3. 具有CSS與響應式網頁程式基礎,並能與程式設計師溝通合作
  4. 能以Visual Studio Code編輯響應式網頁

備註事項

學生優惠價:參加校園IT職涯學習護照方案,享有5折優惠價

課程範例:

推薦課程