第一關：Web前端開發相關的概念
Web系統的組成
Web是Internet上最受歡迎的一種多媒體資訊服務系統。
整個系統由Web伺服器、瀏覽器和通訊協議組成。

Web開發
Web開發就是設計實現Web系統的過程。主要包括瀏覽器端頁面的製作和伺服器端程式的編寫。
 瀏覽器端稱作Web前端；
 伺服器器端稱作Web後端。

瀏覽器
瀏覽器是指可以顯示網頁伺服器或者檔案系統的HTML檔案內容，並讓使用者與這些檔案互動的一種軟體。
常見的瀏覽器有：Firefox、Internet Explorer、Safari、Opera、Google Chrome、QQ瀏覽器、百度瀏覽器、獵豹瀏覽器、360瀏覽器、UC瀏覽器、遨遊瀏覽器、世界之窗瀏覽器等
不是所有的瀏覽器都支援HTML5，同一瀏覽器不同的版本對HTML5的支援情況也不同。

URL
URL（英文Uniform Resource Locator的縮寫）中文譯為“統一資源定位符”,是網際網路上標準資源的地址。網際網路上的每一個檔案都有唯一的URL。
基本URL包含模式（或稱協議）、伺服器名稱（或IP地址）、路徑和檔名。完整的、帶有授權部分的普通統一資源標誌符語法格式如下：
協議://使用者名稱:密碼@子域名.域名.頂級域名:埠號/目錄/檔名.檔案字尾?引數=值#標誌

WWW
WWW（英文World Wide Web的縮寫）中文譯為“全球資訊網”，是Intertnet提供的一種網頁瀏覽服務，常簡稱Web。

http
HTTP (英文Hypertext transfer protocol的縮寫) 中文譯為超文字傳輸協議，是一種詳細規定了瀏覽器和全球資訊網伺服器之間互相通訊的規則。

網站
是指在因特網上根據一定的規則，使用HTML等工具製作的用於展示特定內容相關網頁的集合。使用者可以通過瀏覽器來訪問網站，獲取需要的資訊或者享受網路服務。

Web標準
Web標準是由W3C和其他標準化組織制定的一系列標準的集合。該標準用來建立和解釋基於 Web 的內容，其網頁部分的標準通過三部分來描述：結構、表現和行為。
參考答案：


第二關： Web前端開發相關的技術
Web前端開發相關技術
本關任務：建立第一個網頁。

相關知識
為了完成本關任務，你需要掌握：1.Web前端開發相關技術，2.Web前端開發工具。

基本應用技術
HTML
HTML是Internet上用於設計網頁的基礎語言。它是一種標記語言，用於對網頁中的文字、圖片、聲音等內容進行描述，告訴瀏覽器以什麼方式或結構顯示網頁內容。

CSS
CSS稱作層疊樣式表，“層疊”是指當在HTML中引用了多個樣式檔案，且當樣式發生衝突時，瀏覽器能依據層疊順序處理。CSS彌補了HTML對網頁格式化方面的不足，不僅為網頁元素提供了更為豐富顯示效果，還可以實現網頁佈局和排版定位的作用。

JavaScript
JavaScript是一種指令碼語言，它和HTML結合，使得使用者與網頁元素之間不只是瀏覽與顯示的關係，而是實現了一種實時、動態、互動的頁面功能。

Web前端開發工具
HTML是一種標籤語言，標籤語言程式碼是以文字形式存在的。因此，所有的記事本工具都可以作為它的開發環境。HTML檔案的副檔名為.html或.htm。將編寫好的檔案另存為.html或.htm檔案，就可以在瀏覽器中預覽效果了。

NotePad
Notepad指程式碼編輯器或Windows中的“記事本”程式。是一種開源、小巧、免費的純文字編輯器，建議初學者使用，以增加程式碼編寫體驗，增強對程式碼的理解和記憶。

TextPad
Textpad是一個強大的替代Notepad的文字編輯器，編輯檔案的大小隻受虛擬記憶體大小的限制。支援Unicode編碼，可以編譯、執行簡單的Java程式。

Dreamweaver
Dreamweaver是美國Adobe公司開發的集網頁製作和管理網站於一身的所見即所得網頁編輯器，利用它可以輕而易舉地製作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網頁。

HTML文件結構
完整的HTML檔案包括頭部和主體兩大部分。程式碼示例如下：
HTML文件結構
其中：

文件型別說明：
文件的開始和結束標籤：

...... 文件頭部的開始和結束標籤： ...... 文件主體的開始和結束標籤： ...... 網頁標題的開始和結束標籤： 一級子標題的開始和結束標籤：

......

對齊屬性：align屬性用於設定標題的對齊方式，其取值可以為left、center、right、justify。 程式設計要求 仿照上面的示例，在右側編輯器中的Begin - End區域內補充程式碼，具體要求是： 1.在之間新增網頁標題的設定，標題文字為“我的第一個網頁”； 2.在之間新增一級子標題的設定，子標題文字為“初識HTML”，

標籤的align屬性取值設定為左對齊。

測試說明
補充程式碼後，請點選測評，平臺會對你編寫的程式碼進行測試，如果正確則完成闖關任務。
參考程式碼：