03-建立第一個網頁檔案

03-建立第一個網頁檔案

所謂網頁,可以先理解成就是網路節點上的一個檔案,這個檔案型態是.html,瀏覽器會知道怎麼去解析.html檔案型態,就像是word可以開啟.doc或.docx; excel可以開啟.exl等,而瀏覽器就是專門來開啟.html型態的,而「瀏覽」這個動作就是我們在瀏覽器上方輸入一個「位置」,不管是網路上的位置還是本機的位置,瀏覽器就會去試著看這個位置是否有網頁的檔案,有的話就將其開啟並解析,然後呈現給我們看 建立.html檔案 安裝好vscode之後,我們將vscode打開。並點選新增檔案...
02-建置開發環境

02-建置開發環境

在開始建立我們第一個網頁前,我們得先把製作工具準備好,這堂課我們將會採用Microsoft的VSCode作為我們主要的開發工具。 VScode 在網頁搜尋 vscode,在結果中點選Download 搜尋頁面 或是直接點選這裡 選擇自已的作業系統下載,並依照指示安裝 安裝後啟動應該是這樣的畫面,若是如圖中的畫面就是安裝完畢...
工具- Codepen 線上html製作平台

工具- Codepen 線上html製作平台

同學們大家好,今天我們要來使用一個線上的html、css、javascript編輯器平台,叫作 Codepen 網址: http://codepen.io/ 簡介 codepen是一個線上的即時編輯平台,可以讓你直接在上面進行網頁程式html、css、javascript的編輯並且即時預覽輸出的結果,若註冊後還可以將內容分享給別人,在某些時後只是想要測試一下效果,或是將作出來的東西給別人看時就相當的方便了! 使用方法 首先我們要先創建一個帳號,或是直接用FB帳號登入 登入後的畫面...
01-網頁基本概念

01-網頁基本概念

網路 現在的網路是由相當多的節點透過網路協定所串成的一個架構,原本是美國聯邦政府的一個研究,後來變成軍事、學術界應用相當廣泛的技術,而到了1990後商業化的擴展讓全世界的網路快速興起,由每個區域的小網路又整合成更大的網路,直到今天加上行動智慧硬體、通訊技術的發展,整個網路已經完成融入你我的生活 網站...

CODEPEN

Codepen 線上html製作平台 同學們大家好,今天我們要來使用一個線上的html、css、javascript編輯器平台,叫作 Codepen 網址: http://codepen.io/ 首先我們要先創建一個帳號,或是直接用FB帳號登入 登入後的畫面 可以看到畫面中切了四格,上半部分別是html、css、js以及下半部的預覽窗格 現在我們試著在html內打一些東西 <h1> test </h1> 然後等待一下,或是按ctrl+s存檔,可以發現下半部的預覽窗格也立刻即時的呈現html的內容...