HiSKIO For Business

單元 1 - sublime Text3 安裝與說明

單元 1 - HTML跟你看的不一樣ㄏㄏ

單元 2 - HTML的頭有什麼?

單元 3 - 頭裡面的跟

單元 4 - 摸摸HTML的身體部分

單元 5 - 我的第一個網頁誕生了！

單元 6 - 再來張漂亮的圖片

單元 7 - 加入連結跟外面的世界互動吧！

單元 8 - 完成其他頁面的連結

單元 9 - 繞口令！利用清單完成選單。

單元 1 - CSS與HTML的關係介紹

單元 2 - css選擇器的介紹

單元 3 - css類別選擇器 - 隨心所欲裝扮我的網頁

單元 4 - css標籤選擇器 - 讓網頁標籤千變萬化

單元 5 - css虛擬(偽類)選擇器 - 我的網頁連結不一樣了！

單元 6 - css識別選擇器(id) - 獨一無二專屬為你

單元 1 - 開始隔間 - 網頁版面分析

單元 2 - 家具擺設 - 網頁版面設計

單元 3 - 泥做師傅進駐 - div絕對單位(px)與相對單位(%)的區別

單元 4 - 木工師傅進駐 - css控制div與span標籤

單元 5 - 水電師傅進駐 - 外距(margin)與內距(padding)的調整

單元 6 - 家具的擺設 - 其他css相關應用

單元 1 - 首先！成立一個網站專案資料夾

單元 2 - 區塊元素(block)與行內元素(inline)的不同 (已啟用預覽)

單元 3 - logo擺設與選單設計 - ul li的應用

單元 4 - 動手整理程式碼、程式碼註解、網頁樣板製作

單元 5 - 展示圖片的設計 - 兩欄、多欄版面設計，浮動(float)的應用

單元 6 - 頁尾區塊的設計 - 浮動(float)與清除浮動(clear)的使用

單元 7 - 讓字漂浮在圖片上 - 定位(position)的應用:relative和absolut

單元 8 - 文字position的位置調整：top, left, bottom, right

單元 9 - 讓選單固定在上方 - css定位(position)的應用:fixed操作

單元 1 - 表格與列： table, tr

單元 2 - 表格裡面的表頭跟儲存格：th, td

單元 3 - 我的表格不一樣：css與table的應用

單元 4 - 從DIV實現表格排版的設計

單元 1 - 網頁圖片常用檔案格式介紹：jpg, gif, png

單元 2 - 背景的圖片載入與長寬：background-url, background-size

單元 3 - 背景圖片的重複顯示：background-repeat

單元 4 - 背景圖片位置的移動：background-position

單元 5 - 背景顏色的透明應用：background-color

單元 6 - 背景圖片與img的差異

單元 1 - 表單架構的說明：form (已啟用預覽)

單元 2 - 表單元素 label和input的應用：輸入姓名、電話、Email

單元 3 - 表單元素select、option的應用：詢問類別

單元 4 - 表單元素radio、checkbox的應用：性別、推薦的餐點

單元 5 - 表單元素textarea和submit的應用：輸入更多的意見及填妥送出

單元 6 - 讓我的表單更特別：css與form的應用

單元 1 - 做出漸層不用圖片

單元 2 - 做出圓角讓畫面更特別

單元 3 - 做出陰影讓物件更立體

單元 4 - 解決css讓你錯亂的權重觀念- css接近性

單元 5 - 解決css讓你錯亂的權重觀念- css精確性

單元 1 - 好的房子要有好的結構：網頁內容架構的規劃

單元 2 - seo初步概念：網頁語言與標題的設定

單元 3 - seo初步概念：關鍵字跟網頁敘述的設定

單元 4 - seo初步概念：HTML與圖片的最佳化

單元 1 - 首頁設計美化

單元 2 - 菜單頁的設計美化

單元 3 - 餐廳環境頁的設計美化

單元 4 - 交通資訊頁的規劃：google地圖的崁入

單元 1 - 免費線上圖庫下載：pixabay、unsplash、flickr.com

單元 2 - 免費線上icon下載：https://material.io/icons/、flaticon

單元 3 - 免費線上占位圖片產生器：https://placem.at/

單元 4 - 免費線上hml和css教學資源