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


從最簡單的上中下垂直區塊切割,逐步實現側邊欄與主體內容的設計。
接下來考慮固定尺寸版型的設計不符跨尺寸裝置的需求,改以百分比設計元素寬度。
最後的成果可以讓網頁內容動態符合任何螢幕尺寸呈現需求。
經過第一堂課程,學員可以瞭解幾個於排版有重要關聯的HTML標籤以及CSS樣式。
除了表列標籤與CSS的實際運用,另外就是為了方便維護,選擇器的導入與CSS樣式的進一步歸納整理設計。
後續的課程將在這些基本的版型基礎上,全面擴充更重要的技術內容,包含更結構化的CSS設計,響應式網頁開發等等重要的現代網頁開發議題。
Web 前端開發-零基礎入門:假日班


從最簡單的上中下垂直區塊切割,逐步實現側邊欄與主體內容的設計。
接下來考慮固定尺寸版型的設計不符跨尺寸裝置的需求,改以百分比設計元素寬度。
最後的成果可以讓網頁內容動態符合任何螢幕尺寸呈現需求。
經過第一堂課程,學員可以瞭解幾個於排版有重要關聯的HTML標籤以及CSS樣式。
HTML標籤 | CSS樣式 |
div:區塊切割 p :文字段落 span:區段 ul/li:清單 | width:寬度 height:高度 float:浮動 overflow:溢出控制 color:顏色 |
除了表列標籤與CSS的實際運用,另外就是為了方便維護,選擇器的導入與CSS樣式的進一步歸納整理設計。
CSS 選擇器 |
Tag 標籤名稱選擇器 :將指定的樣式內容套用於特定的標籤。 Class選擇器:將指定的樣式內容套用於對應的 class 。 Id 識別選擇器:將指定的樣式內容套用於對應的id 標籤。 |
後續的課程將在這些基本的版型基礎上,全面擴充更重要的技術內容,包含更結構化的CSS設計,響應式網頁開發等等重要的現代網頁開發議題。
Web 前端開發-零基礎入門:假日班
沒有留言:
張貼留言