PM技術課｜Web知識知多少？
"\u003Cblockquote\u003E\u003Cp\u003E本文筆者將與大家分享HTML\u002FCSS\u002FJavaScript這三種網頁技術，以及HTML5、H5等的相關知識。\u003C\u002Fp\u003E\u003C\u002Fblockquote\u003E\u003Cimg src=\"http:\u002F\u002Fp3.pstatp.com\u002Flarge\u002Fpgc-image\u002FRX7TjK2DOCWSvp\" img_width=\"800\" img_height=\"450\" alt=\"PM技術課｜Web知識知多少？\" inline=\"0\"\u003E\u003Cp\u003E\u003C\u002Fp\u003E\u003Ch2\u003E無處不在的網頁\u003C\u002Fh2\u003E\u003Cp\u003E網頁存儲在某臺計算機（即服務器）上，並通過網絡與其他計算機相連。網頁通過網址（URL）來識別與訪問，當我們在瀏覽器輸入網址後，經過一段複雜而又快速的程序，網頁會被下載到用戶的計算機上，用戶的瀏覽器會解析網頁內容，最終展示給用戶。\u003C\u002Fp\u003E\u003Cp\u003E網頁展示的信息可以包括：圖片、文字、音頻、視頻等內容，網頁上面還有鏈接指向更多的網頁，最終形成一個巨大的互聯網。\u003C\u002Fp\u003E\u003Cp\u003E比如：百度的網頁就存儲在百度的服務器中，當我們在瀏覽器中輸入網址www.baidu.com（即URL地址），百度的網頁會從服務器下載到本地計算機上，瀏覽器接收這些數據並解析，百度的首頁就顯示出來了。\u003C\u002Fp\u003E\u003Cp\u003E在電腦端，我們使用瀏覽器瀏覽網頁，比如：使用Internet Explorer、Edge、Chrome、Safari、360安全瀏覽器、搜狗瀏覽器、QQ瀏覽器等瀏覽器，訪問的網頁可以是搜索引擎https:\u002F\u002Fwww.baidu.com，可以是電商平臺https:\u002F\u002Fwww.taobao.com，甚至是社交平臺https:\u002F\u002Fwx.qq.com。\u003C\u002Fp\u003E\u003Cp\u003E由於移動互聯網的大發展，很多人可能沒有意識到，網頁其實可以實現大部分常用的功能。\u003C\u002Fp\u003E\u003Cp\u003E手機、iPad上也有各種瀏覽器，我們可以輸入網址並直接訪問，各大手機廠商在手機中預先安裝了自己的瀏覽器，阿里巴巴、百度、騰訊、搜狗等互聯網公司也推出了自家的瀏覽器APP。爲了獲得競爭優勢，互聯網公司還在瀏覽器上開發了各種功能，比如：智能搜索、去廣告插件等。\u003C\u002Fp\u003E\u003Cp\u003E除了瀏覽器，不少APP也嵌入了瀏覽器功能。\u003C\u002Fp\u003E\u003Cp\u003E比如：微信的公衆號，我們打開一篇微信公衆號文章，就是打開一個網頁；今日頭條等新聞客戶端也是個巨大的瀏覽器，我們打開一條新聞，就是進入相應的網頁；淘寶裏面的商品簡介，也是個網頁。這些網頁“僞裝”得太像APP頁面了，以至於我們沒有意識到。\u003C\u002Fp\u003E\u003Cimg src=\"http:\u002F\u002Fp1.pstatp.com\u002Flarge\u002Fpgc-image\u002FRX7TjKOHs5p708\" img_width=\"600\" img_height=\"319\" alt=\"PM技術課｜Web知識知多少？\" inline=\"0\"\u003E\u003Cp\u003E\u003C\u002Fp\u003E\u003Ch2\u003E網頁三劍客：HTML\u002FCSS\u002FJavaScript\u003C\u002Fh2\u003E\u003Cp\u003E文字、圖片、表格、音頻、視頻是網頁最常見的元素。\u003C\u002Fp\u003E\u003Cp\u003E在網頁上點擊鼠標右鍵，選擇菜單中的 “查看源文件” ，就可以看到網頁的實際內容：網頁實際上只是一個純文本文件！它通過各式各樣的標記對頁面上的文字、圖片、表格、聲音等元素進行描述，而瀏覽器則對這些標記進行解釋並生成頁面，於是就得到我們看到的豐富的頁面。\u003C\u002Fp\u003E\u003Cp\u003E比如：在微信公衆平臺官網（>https:\u002F\u002Fmp.weixin.qq.com）點擊右鍵，查看源文件，可以發現這個網頁的源文件全都都是文字。\u003C\u002Fp\u003E\u003Cimg src=\"http:\u002F\u002Fp3.pstatp.com\u002Flarge\u002Fpgc-image\u002FRX7TjKaBZ5naYU\" img_width=\"600\" img_height=\"241\" alt=\"PM技術課｜Web知識知多少？\" inline=\"0\"\u003E\u003Cimg src=\"http:\u002F\u002Fp3.pstatp.com\u002Flarge\u002Fpgc-image\u002FRX7TjKmGOb8mC1\" img_width=\"600\" img_height=\"171\" alt=\"PM技術課｜Web知識知多少？\" inline=\"0\"\u003E\u003Cp\u003E你可能會奇怪，爲什麼在源文件看不到任何圖片，而在瀏覽器顯示的時候可以看到呢？\u003C\u002Fp\u003E\u003Cp\u003E這些文件中存放的只是圖片的鏈接位置，圖片與網頁文件是各自獨立存放的，甚至可以不在同一臺計算機上，瀏覽器可以自動訪問這些鏈接並顯示出來。音頻、視頻等非文字內容也是類似的。\u003C\u002Fp\u003E\u003Cp\u003E絕大多數網頁是由HTML、CSS和JavaScript三種技術開發的，HTML\u002FCSS\u002FJavaScript也被稱爲網頁三劍客。\u003C\u002Fp\u003E\u003Cp\u003EHTML提供網頁內容和結構，CSS控制網頁的外觀，JavaScript提供用戶交互，一個很經典的例子是說HTML就像一個人的骨骼、器官，而CSS就是人的皮膚，有了這兩樣也就構成了一個植物人了，加上javascript這個植物人就可以對外界刺激做出反應，可以思考、運動、可以給自己整容化妝等等，成爲一個活生生的人。\u003C\u002Fp\u003E\u003Cp\u003E\u003C\u002Fp\u003E\u003Ch3\u003EHTML\u003C\u002Fh3\u003E\u003Cp\u003EHTML（Hypertext Markup Language，超文本標記語言）是一門標記語言，用於創建網頁和 Web 應用程序，HTML的基本元素是等元素，分別表示文本、圖像、表格等。瀏覽器發出 URL 請求時，首先需要返回 HTML 文檔，之後瀏覽器對該文件進行解析。\u003C\u002Fp\u003E\u003Cp\u003E比如：下面是一個基本的網頁，左邊是網頁源代碼，右邊是展示效果。<\u002Fhtml>之間是網頁的全部內容，<\u002Fhead>之間是標題相關的內容，這裏爲空，<\u002Fbody>之間是網頁的主體內容，
