Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
邁入網頁前端開發世界的敲門磚,HTML5 與 CSS3 靜態網站建置
Rating: 4.9 out of 5(52 ratings)
119 students

邁入網頁前端開發世界的敲門磚,HTML5 與 CSS3 靜態網站建置

建置一個網頁會需要學習 HTML5 的結構與特性,美化則需要搭配 CSS3 來進行排版與設計。從頭開始製作一個食譜靜態網頁,提升網頁設計開發實作能力
Last updated 8/2020
Chinese (Traditional)
Chinese (Traditional) [Auto],

What you'll learn

  • 學習 HTML5 網頁設計建構
  • 了解 UI Framework 建置靜態頁面
  • 使用 Grid Flex 進行 CSS 排版
  • CSS3 標籤與使用方式

Course content

5 sections37 lectures6h 45m total length
  • 網站概念介紹5:37
  • 網站建置概觀9:06
  • 常見網站版型介紹 (上)4:52

    課程補充資料可於底下查閱。
    https://docs.google.com/document/d/1tHfe1rMBsUj40l0MJw4oSTFbDgkJM336wiSuBO-SQ6E/edit

  • 常見網站版型介紹 (下)7:21

Requirements

  • 不需要嚴謹的程式背景,願意思考學習
  • 有操作 Mac/Windows 電腦的基礎
  • 具備快樂學習的心情與一個假日
  • 對網頁有認識,操作過網頁的經驗

Description

說到網頁設計不得不提 HTML/CSS,你們有聽過嗎?如果聽過但尚未有足夠了解,這門課會幫助你暸解建置一個網頁時所需要用到的標籤與結構。使用 CSS3 的語法從邊距設定、Box model 邊框、列表等部分去了解網頁是如何形成的。

你為什麼需要上這堂課?

上過 Javascript 的同學一定清楚網頁互動很重要,並且若要建置網頁對於 HTML/CSS 的了解是必不可少的。在這堂課程中我們會走過一次網頁從 DOM 結構的標籤、版型、網頁內容、連結表單等,到使用 CSS 屬性概念去製作一個食譜的靜態網頁。其中對於選擇器的使用、框架的引用皆是這堂課程中重要的概念。

本課程將會包含以下內容:

這堂課程分為五個大章節。從網站的概念著手建置導覽內容與常見的版型了解網頁的呈現,第二章會講解 HTML 結構性的內容、第三第四章則重視 CSS3 的語法/選擇器的使用,最後則是套件框架的應用與說明。


關於這堂課

快樂學程式在台灣擁有超過 1000 人參與的在地社群活動。截至 2020 年我們已經舉辦超過三年的社群與活動,每個月皆有程式思維相關的聚會與交流,深耕社群並參與推廣工程思維,讓非本科系的男孩女孩皆能一窺程式的風趣與培養解決問題的能力。這次與 Glove 推出這堂「邁入網頁前端開發世界的敲門磚,HTML5 與 CSS3 靜態網站建置」內容屬於建構式網頁設計入門。做為上課學員的你可以在裡面跟著一起練習,反覆操作嘗試建立自己的靜態網頁:)

Who this course is for:

  • 對前端開發有興趣,有嘗試使用 HTML/CSS 來撰寫程式
  • 想建置靜態網頁,從設計轉成工程師的念頭
  • 跨領域想撰寫網頁應用程式,建置自己的網頁內容