網頁設計第八週 - position固定位置、選單、免費空間使用

這一篇介紹如何固定div放在網頁固定的位置、如何製作選單、最後如何上傳自己的製作好的網頁到一個免費空間。

教學網址:

position固定位置: https://youtu.be/ijlT3uGSUHE (上次上課沒說)

選單: https://youtu.be/i2FZCaxo4M4 (有補充上課沒提到的功能)

免費空間使用: https://youtu.be/bYIZcF4Z9LY



參考資料:

南台科大蔡承洋老師教學影片

一定要學會的HTML5+CSS3 網頁設計實作應用

網頁設計第七週 - 背景在body div a、CSS排版

這一篇主要介紹背景如何在body、div、a等元素被套用以及如何利用CSS設定排版(margin、border、padding)


教學網址:

背景在body div a: https://youtu.be/TeTvm9zwJDg

CSS排版: https://youtu.be/nYKzNf16fgo


參考資料:

南台科大蔡承洋老師教學影片

一定要學會的HTML5+CSS3 網頁設計實作應用

網頁設計第六週 - CSS編寫

這一篇主要介紹CSS的三種編寫方式，請熟記第二種和第三種編寫方式。

教學網址 - https://youtu.be/HOOztLohtBI

教學投影片 -

https://drive.google.com/file/d/0BzeGZ1iWvKr6YVpvUDctMkZobzA/view?usp=sharing



參考資料:

南台科大蔡承洋老師教學影片

一定要學會的HTML5+CSS3 網頁設計實作應用

網頁設計第五週 - 常用標籤、放入圖片、音樂和影片

這一篇主要介紹在編輯網頁時常使用的標籤類型，以及如何放入不同圖片、音樂與影片。


教學影片網址 -

常用標籤: https://youtu.be/6ALGzdNoaHo

放入圖片、音樂和影片: https://youtu.be/lXIcANzdZu0

教學投影片 -

https://drive.google.com/file/d/0BzeGZ1iWvKr6d1RFWE85ME4yakE/view?usp=sharing

https://drive.google.com/file/d/0BzeGZ1iWvKr6YVpvUDctMkZobzA/view?usp=sharing




參考資料:

南台科大蔡承洋老師教學影片

一定要學會的HTML5+CSS3 網頁設計實作應用

網頁設計第四週 - 文字、排版、超連結、圖片

這一篇主要介紹如何在網頁中放入文字、超連結、圖片。

最後根據需求排版網頁。

教學影片網址 - https://youtu.be/IWvtD9zHlU0

教學投影片 -

https://drive.google.com/file/d/0BzeGZ1iWvKr6Vzl2Rzl3b24xOFk/view?usp=sharing
https://drive.google.com/file/d/0BzeGZ1iWvKr6d1RFWE85ME4yakE/view?usp=sharing




參考資料:

南台科大蔡承洋老師教學影片

一定要學會的HTML5+CSS3 網頁設計實作應用

網頁設計環境安裝教學-xampp、Aptana、Filezilla

這一篇主要介紹網頁設計在開發前的環境設定教學。


注意事項:

• 各個軟體安裝時請務必不能出現 中文路徑
  
• xampp安裝完請記得使用 127.0.0.1 或 localhost 測試並設定 安全密碼
  
• Apatana安裝前確定要安裝好Java JRE 32位元、Node.js
  
• Aptana的專案檔放置位置要設定在 xampp/htdocs

教學影片網址 - https://youtu.be/YVK-37IP85U