Web 前端開發－零基礎入門：第一堂

第一天的課程，我們從最簡單的版型實作開始，逐一介紹各種必要的基本標籤用途，以及入門CSS樣式的使用技巧。



從最簡單的上中下垂直區塊切割，逐步實現側邊欄與主體內容的設計。

接下來考慮固定尺寸版型的設計不符跨尺寸裝置的需求，改以百分比設計元素寬度。

最後的成果可以讓網頁內容動態符合任何螢幕尺寸呈現需求。

經過第一堂課程，學員可以瞭解幾個於排版有重要關聯的HTML標籤以及CSS樣式。

HTML標籤	CSS樣式
div：區塊切割 p ：文字段落 span：區段 ul/li：清單	width：寬度 height：高度 float：浮動 overflow：溢出控制 color：顏色

除了表列標籤與CSS的實際運用，另外就是為了方便維護，選擇器的導入與CSS樣式的進一步歸納整理設計。

CSS 選擇器

Tag 標籤名稱選擇器 ：將指定的樣式內容套用於特定的標籤。 Class選擇器：將指定的樣式內容套用於對應的 class 。 Id 識別選擇器：將指定的樣式內容套用於對應的id 標籤。

後續的課程將在這些基本的版型基礎上，全面擴充更重要的技術內容，包含更結構化的CSS設計，響應式網頁開發等等重要的現代網頁開發議題。

Web 前端開發－零基礎入門：假日班