一 web1.0時代的網頁制作
網頁制作是web1.0時代的產物，那個時候的網頁主要是靜態網頁，所謂的靜態網頁就是沒有與用戶進行互動而僅僅供讀者瀏覽的網頁，我們當時稱為“牛皮癬”網頁，
例如一篇QQ日志、一篇博文等展示性文章，在web1.0時代，用戶能做的唯一事情就是瀏覽這個網站的文字圖片內容，這時用戶也不能像現在在大多數網站都可以評論交流（缺乏互動性），
相信可能大多數人都聽過“網頁三劍客 Dreamweaver+Fireworks+Flash”吧，2010這個組合就是web1.0時代額產物，我在2010年以前還是在使用三劍客做網頁設計的，
二 web2.0時代的前端開發
“前端開發”是從“網頁制作”演變而來的，
從2005年開始，互聯網進入web 2.0時代，由單一的文字和圖片組成的靜態網頁已經不能滿足用戶的需求，用戶需要更好的體驗，
在web 2.0時代，網頁有靜態網頁和動態網頁，
所謂動態網頁，就是用戶不僅僅可以瀏覽網頁，還可以與服務器進行互動，舉個例子，你登陸新浪微博，要輸入賬號密碼，這個時候就需要服務器對你的賬號和密碼進行驗證通過才行，
web2.0時代的網頁不僅包含炫麗的影片、音頻和視頻，還可以讓用戶在網頁中進行評論交流、上傳和下載檔案等（互動性），這個時代的網頁，如果是用“網頁三劍客Dreamweaver+Fireworks+Flash”制作的，那是遠遠不能滿足需求，
現在網站開發無論是開發難度，還是開發方式上，都更接近傳統的網站后臺開發，所以現在不再叫“網頁制作”，而是叫“web前端開發”，
所以，處于web2.0時代的你，如果要學習網站開發技術，就不要再相信所謂的“網頁三劍客Dreamweaver+Fireworks+Flash”，因為這個組合已經是上個互聯網時代的產物，而且這個組合開發出來的網站問題也非常多，例如代碼冗余、網站維護困難（學習到后期，你會知道為什么不用這個組合了，
三 Web前端能做什么？
公司官網（在PC通過瀏覽器來訪問公司網站）移動端網頁（在手機上來瀏覽公司資訊、小游戲等）移動端APP（例如：淘寶、去哪兒旅游、攜程等）微信小程式（微信最新推出的功能，隨用隨裝，不占用手機空間），前端開發所學技術由簡單到難，所以在很多網站上你會看到“七天入門前端”的視頻博客等等，也就是說一星期就學會了HTML+CSS，最基本的頁面你就可以書寫了，
四 前端開發都有哪些內容
我們知道，用所謂的網頁三劍客已經不能滿足需求了，那前端開發究竟要學習什么技術呢？網頁最主要由3部分組成：結構、表現和行為，網頁現在新的標準是W3C，目前模式是HTML、CSS和JavaScript，
（1）HTML是什么？
HTML，全稱“Hyper Text Markup Language（超文本標記語言）”，簡單來說，網頁就是用HTML語言制作的，HTML是一門描述性語言，是一門非常容易入門的語言，
（2）CSS
CSS，全稱“（層疊樣式表）”，以后我們在別的地方看到“層疊樣式表”、“CSS樣式”，指的就是CSS，
（3）JavaScript
JavaScript是一門腳本語言，
HTML、CSS和JavaScript的區別 我們都知道前端技術最核心的是HTML、CSS和JavaScript這三種，但是這三者究竟是干嘛的呢？
“HTML是網頁的結構，CSS是網頁的外觀，而JavaScript是頁面的行為
如果我們把前端開發的程序比喻成“建房子”，做一個網頁就像蓋一棟房子
1、先把房子結構建好（HTML）
2、建好房子之后給房子裝修（CSS），例如往窗戶安上窗簾、往地板鋪上漂亮的瓷磚
3、最后呢，裝修完了之后，當夜幕降臨的時候，我們要開燈（JavaScript），這樣才能看得見里面，
五 Web前端開發環境
市面上有很多的HTML編輯器可以選擇，常見的Hbuild、Sublime Text、Dreamweare都可以用來開發HTML， 當然PyCharm也支持HTML開發，
1、瀏覽器
瀏覽器在本地也能打開html檔案，瀏覽器就跟解釋器一樣，從上倒下，從左到右
全球共有五大瀏覽器廠商，我們主要以chrome為主
ie
chrome
firfox
safri
presto
瀏覽器內核不同，瀏覽器渲染引擎不同（后期考慮兼容性問題），其他瀏覽器都是使用這5款瀏覽器內核
2、瀏覽器歷史：
世界最早瀏覽器，網景瀏覽器（Netscape ） 后來它想做作業系統，動了微軟的奶酪，微軟就想弄死他， 微軟做的也特別的絕情，微軟利用windows作業系統的市場占有率，提供了免費瀏覽器ie,而且windows 作業系統里還必須有 中國最早瀏覽器ie6，國企內就用ie6， 瀏覽器不同，決議的標簽標準不同，微軟太霸道，就不改標準，堅持不更新，后來谷歌和火狐搶占了市場，IE就傻逼了，目前也只有傻逼才用IE，，， 市場越發地混亂，于是w3c（萬維網聯盟（World Wide Web Consortium，W3C））成立，用來制定大家的統一標準 須知：學前端一半作業在考慮兼容性，目前html5在兼容性方面解決的比較好
3、檔案后綴名規范
.htm和.html擴展名的區別
#1、DOS系統（win95或win98）下只能支持長度為3的后綴名，所以老版本的系統一直在用.htm后綴 #2、但在windows后綴長度可以大于3位，所以windows下無所謂htm與html，html是為長檔案的格式命名的 #3、如果檔案后綴是.htm，毫無疑問，瀏覽器也可以兼容，但推薦使用.html
六 HTML簡介
用戶使用瀏覽器打開網頁看到結果的程序就是：瀏覽器將服務端的文本檔案(即網頁檔案)內容下載到本地，然后打開顯示的程序，
而文本檔案的檔案結構只有空格和換行兩種組織方式，如此，文本檔案在打開顯示時，顯示的效果將會非常非常非常的單一，
為了讓顯示的效果不那么單調，我們會偏向使用word一類的文本編輯工具來編排文本內容，編排的原理就是：在編輯檔案時會選中各部分內容，然后為內容打上不同的標記，比如什么是標題，什么是段落，然后存放硬碟里，等下次打開時，word會識別之前的標記，然后按照預先編排好的結果顯示出來
站在顯示文本內容的角度去看，瀏覽器與word的原理一樣，我們可以將瀏覽器當成一個網頁版的只讀word，瀏覽器也必須有一套自己能識別的標記文本的規范，該規范被稱為HTML,HTML全稱是超文本標記語言（HyperText Markup Language）
“超文本”指的是用超鏈接的方法，將各種不同空間的文字資訊組織在一起的網狀文本
“標記”指的是在編輯文本時用特殊的記號標記一下各部分內容的意義，該記號稱之為標簽，比如用標簽h1標記標題，用標簽p標簽段落，如此我們標記一首唐詩就成了如下格式：
<h1>臥石綠</h1> <p>臥石一支綠</p> <p>沃枝回芳脾</p> <p>魚吻臥石水</p> <p>臥石答春綠</p>
所以我們學習HTML就是在學習一系列的標簽
HTML注意事項!!!
#1、記號/標簽是不會顯示出來的， #2、雖然用<h1>標記的文本在顯示時會被加大加粗，但請務必記住，HTML的作用只有一個它是專門用來對檔案做記號來標識其語意的（語意指的是該文本是做什么用的），加大和加粗這種為文本添加樣式的操作并不是HTML擅長的，雖然早期的時候確實也用HTML來制作樣式，但以后我們專門用CSS來做這件事，這也是一種解耦合的思想 #3、HTML是一個網頁的主體部分，也是一個網頁的基礎，因為一個網頁可以沒有樣式，可以沒有互動，但是必須要有網頁需要呈現的內容，所以HTML部分是整個前端的基礎，
七 HTML發展史
超文本標記語言（第一版）：在1993年6月作為互聯網工程作業小組（IETF）作業草案發布（并非標準），后來陸續由w3c制定標準
IETF簡介
- IETF是英文Internet Engineering Task Force的縮寫, 翻譯過來就是"互聯網工程任務組"
- IETF負責定義并管理因特網技術的所有方面，包括用于資料傳輸的IP協議、讓域名與IP地址匹配的域名系統（DNS）、用于發送郵件的簡單郵件傳輸協議（SMTP）等
W3C簡介
- W3C是英文World Wide Web Consortium的縮寫， 翻譯過來就是W3C理事會或萬維網聯盟, W3C是全球互聯網最具權威的技術標準化組織.
- W3C于1994年10月在麻省理工學院計算機科學實驗室成立，創建者是萬維網的發明者Tim Berners-Lee
- W3C負責web方面標準的制定，像HTML、XHTML、CSS、XML的標準就是由W3C來定制的，
在HTML的早期發展中，大部分標準都是所謂的retro-spec，即先有實作后有標準，在這種情況下，HTML標準不是很規范，瀏覽器也對HTML頁面中的錯誤相當寬容，這反過來又導致了HTML開發者寫出了大量含有錯誤的HTML頁面 html語言本身有一些缺陷（例如： 內容和形式不能分離；標簽單一；資料不能復用等等），隨著xml的興起人們希望xml來彌補html的不足，但是目前有成千上萬的網頁都是用html撰寫的，所以完全使用xml來替代html還為時過早，于是W3C在2000年推出了xhtml1.0， 建立xhtml的目的就是實作從html向xml的過度 為了規范HTML，W3C結合XML制定了XHTML 1.0標準，這個標準沒有增加任何新的標簽，只是按照XML的要求來規范HTML，并定義了一個新的MIME type application/xhtml+xml，W3C的初衷是要求瀏覽器對這個MIME type實行強錯誤檢查，如果頁面有HTML錯誤，就要顯示錯誤資訊，但是由于已有的web頁面中已經有了大量的錯誤，很多開發者拒絕使用新的MIME type，W3C不得已，在XHTML 1.0的標準之后增加了一個附錄C，允許開發者使用XHTML語法來寫頁面，同時使用舊的MIME type，application/html，來分發頁面 W3C隨后在XHTML 1.1中取消了附錄C，即使用XHTML 1.1標準的頁面必須用新的MIME type來分發，于是這個標準并沒有很多人采用 有了XHTML的教訓，W3C在制定下一代HTML標準時（HTML5），就將向后兼容作為了一個很重要的原則，HTML5確實引入了許多新的特性，但是它最重要的一個特性是，不會break已有的網頁，你可以將任何已有的網頁的第一行改成<!DOCTYPE html>，它就成也一個HTML5頁面，并且可以照樣在瀏覽器里正常的展示， 簡而言之 1、HTML語法非常寬松容錯性強; 2、XHTML更為嚴格,它要求標簽必須小寫、必須嚴格閉合、標簽中的屬性必須使用引號引起等等; 3、HTML5是HTML的下一個版本所以除了非常寬松容錯性強以外,還增加許多新的特性
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/120026.html
標籤：Html/Css
下一篇：html解決空格顯示問題