tml+css基礎一：html簡介和發展史

HTML全稱（hypertext markup language）譯為超文本標記語言，其譯文代表了HTML的含義，它和其他編程語言不同的是，HTML不是一門真正意義上編程語言，而是一種標記語言，通過帶有尖角號的標簽對文本進行標記，從而實現網頁的結構搭建。

1.2、HTML發展史

HTML創始人（蒂姆·伯納斯-李）蒂姆·伯納斯-李除了是HTML的創始人，還是w3c組織的主席。

1、HTML1.0 （1991年12月）

1991年萬維網（www）在互聯網上首次露面，也隨之引起了巨大的轟動。

1989年，伯納斯-李寫了一份備忘錄，提出建立一個基于互聯網的超文本系統。同年和另外一個工程師一起進行聯合資金申請，但是這個項目并沒有通過。

1991年底的時候，伯納斯-李公開了一份“HTML Tag”的文檔，里面描述了組成HTML初始版本的18個元素

2、HTML2.0（1995年11月）

HTML 2.0是HTML語言的擴展。????

與原始版本的HTML不同，HTML 2.0被創建為Web標準，規定了常見的網頁結構

3、HTML3.2（1996年1月）

慘淡的"第一次瀏覽器大戰時期（Netspace Vs IE）"，兩大巨頭不斷推出重大舉措試圖控制整個領域。???????

網頁開發者是這場戰爭中的焦點。商業戰爭就像軍備競賽，各家公司為了保持領先，招兵買馬。各家都有各家的規則。?????????

那時候，你不得不寫兩份不同的網頁，一個用于網景的瀏覽器，另一個用于微軟的瀏覽器

4、HTML4（1997年12月）

瀏覽器大戰接近尾聲，W3C（世界萬維網聯盟）成立，他們打算通過制定統一的HTML標準，使整個產業能有序的發展。 ? ? ? ? ? ?

他們計劃用兩種語言分離出HTML的表達式（HTML 4.0）和結構（CSS），并且說服瀏覽器廠商接受這些標準

這次發布提供了規范的三種變體：

Strict，嚴格版本；

Transitional，過渡版本；

Frameset，iframe框架集；

HTML4.0 采納了許多瀏覽器特定的元素類型及屬性，但是同時也把 Netscape 的視覺化標記標記為過時的尋求淘汰; 贊成使用樣式表; 同時在1998年4月對HTML4.0進行了微小的修訂，沒有增加版本號HTML5.0

5、HTML4.01（1999年12月）

像 HTML4.0 一樣提供了三種變體，并且他的最終錯誤修訂版在2001年的5月12日發布

6、XHTML 1.0（2000年1月）

各大瀏覽器廠商紛紛接受W3C標準的時候，新技術出現了。?????????????

HTML和另一種語言XML融合，XHTML（可拓展的超文本標記語言）就此誕生。???????????

它繼承了HTML的通用型和瀏覽器的兼容性，繼承了XML的嚴密性和可拓展性

7、HTML5（2014 年 10 月）

HTML5是HTML最新的修訂版本，由W3C制定，目標是取代1999年所制定的HTML 4.01和XHTML 1.0標準

我們現在使用的是html5版本，因為由于新興框架的出現和瀏覽器兼容性的提升，讓我們選擇了html5。

了解同學們的專業學習情況，增強團隊協作能力，近日，金盾2201班舉行了以小組為單位的HTML網頁項目驗收。本次項目驗收特邀鄧旎、唐勇兩位老師擔任評委。

金盾特訓班作為我校以高薪就業為終極目標的特色班級，除了日常文化課學習之外，提升項目實戰經驗也成為了他們必不可少的日常操練項。

驗收現場

各小組以PPT講解結合網頁作品演示的形式，從想法構思、選定項目、作品功能實現等方面來展示團隊作品。每位同學輪流上臺講解，在操作演示中突顯實踐的重要性。

項目驗收考驗的是大家代碼知識的運用情況，同時還能提高表達能力及項目制作水平，為成為一名“準職業人”打好基礎。大家紛紛表示，雖然在過程中遇到了數不清的困難，但是并沒有因此而放棄，在老師的輔導和組員之間的互幫互助下，促使此次項目圓滿完成。

頒獎典禮

經評委現場評分，最終評選出團隊一、二、三等獎及優秀個人獎。

團隊一等獎

王涵、李嘉星、劉燦、段李可

團隊二等獎

姚宏源、周旺、駱鵬飛、凌海峰

團隊三等獎

潘虹、張雅婷、胡偉

優秀個人獎

羅浩智、付清、陳韜、殷明、莫藝清

此次項目驗收，充分展示了金盾班同學的理論水平、專業知識、語言表達與實踐操作能力，希望各位同學再接再厲，發揮個人潛能，展示出更加優秀的作品。

avaScript框架。

哈嘍，各位小伙伴們大家好，歡迎來到前端課堂。這節課來講解JavaScript的簡介，讓我們再深入的了解一下JavaScript。其實這張截圖就是從JavaScript的官方文檔中截圖下來的，它的最大的點就是鑒定點的JavaScript框架。當然下面這些易學易用、性能出色等等也都是它的優勢了。

JavaScript這個發音有人也稱為Vue，就是拿每個字母來讀，但是正常就讀Vue就行了。它說類似Vue讀音就是一模一樣的，是一款用于構建用戶界面的JavaScript框架。它基于標準的HMCS和GS的進行構建，也就是說學習起來比較簡單，只需要會HMCS、GS就能學習Vue了。

并且還提供了一套聲明式組建化的編程模型。關于什么是聲明式，什么是組建化，后續在學習的過程中大家慢慢能體會到，尤其是組件，這個真的是非常大的優勢。而目前的框架基本都具有這個功能，它可以幫助快速的開發用戶界面，這就是它可以提升開發的時間成本，提升開發體。無論是簡單的復雜的頁面都可以勝任，這是JavaScript的優勢。

所以現在JavaScript寫項目的比較多了，無論是后臺管理系統還是前端的站點都會采用JavaScript來進行實現，比較方便，包含移動端，頁面也有用JavaScript來進行實現的。這里邊最大的點就是可以看到這三個大字：漸進式。

有同學不明白老師什么是漸進式框架，接下來就用官方的介紹來給大家描述一下。JavaScript是一個框架，這毋庸置疑也是一個生態。關于生態這個點我想多說兩句，什么是生態？如果JavaScript框架就只有它自己本身沒有額外的一些支持，我指的額外支持是沒有作為開發者的支持，沒有一個環境，沒有一個圈子去支持它，JavaScript框架是火不起來的。

之所以它能火起來就是JavaScript本身這個框架很好，就是它有很大的優勢很好。其次大家對于它非常認可，認可它之后就會在這個JavaScript的基礎之上去做很多針對于JavaScript框架才能用到的組件或者叫插件。

比如給大家舉個例子輪播圖，如果JavaScript框架非常好，但JavaScript會幫你去實現一個輪播圖功能嗎？不會。但誰會？作為開發者的，我們會實現一個特別好的輪播圖，把它上傳上去，作為其他開發者也可以去把別人實現的輪播圖直接下載下來，放在你的項目當中就可以直接使用，你不用自己再寫一套了。

這就是我們所說的生態，它的生態已經非常完善了，非常強大。所以它說vivo現在既是一個框架也是個生態，而且vivo提供的功能也比較多。不僅是vivo本身，它還提供了路由，就是來做頁面跳轉的管理頁面之間的關系的，還提供了數據管理方案。

比如說以vivo 2是vivo x，vivo 3是平安雅，這些都是幫我們更好的去做開發的。它還提供了很多，比如說國際化的一些包等等非常多。還有一些ui組建庫、eleven ui、anti、want以及on the zion等等，所以說它是個生態。

而且大家日后要想明白一個問題，什么問題？一個框架或者說一個技術它是否能火，它的生態決定了它是否真的能火。生態非常繁榮，那它一定會火。如果生態圈中連大家討論都沒人討論，那這個東西基本上不會火了。

大概這樣，其功能覆蓋了大部分前端開發常見的需求，但外部事件也是十分多樣化，所以不同的開發者對于這個實現也不太一樣。所以他說外部上構建的東西可能形式上、規模上都會有很大的不同點。

比如說你是移動端的商城，它是后端的管理系統，這是完全不同的對不對？所以他說考慮到這一點，vivo的設計非常注重靈活性和可被逐步集成的特點。其實它這個可被逐步集成就是它的漸進式的框架的優勢。

什么意思？就是我可以在完整的項目當中去使用vivo，我也可以在其中某一個功能上去使用vivo，甚至我可以只在某一個html頁面中去使用vivo的某一個功能，這就是漸進式可以很低端的，就是可以很簡潔的使用在一個頁面中使用，也可以在一個功能模塊中使用，甚至可以在整個項目中全用vivo來構建。

所以說這是它漸進式的特點。根據你的場景需求，他說可以將vivo分成以下幾種使用方式。

·比如說第一種就是無需構建，無需構建步驟漸進式增強的html。所謂的就是漸進式增強的靜態的html就是在你的一個html文件中去引入vivo，就這么簡單。你也可以把它當成一個組件，然后引入在一個功能當中，當成一個功能來引入，甚至可以整個項目創建成一個單頁面應用的形式，然后去使用它。

·什么是單頁面應用spa？就是整個項目就只有一個頁面，那頁面中如何做跳轉？頁面中內容怎么展示？它是通過更換頁面內容，就是在一個頁面中一直不斷的更換內容，讓你感覺是很多個頁面的樣子。這是現在比較流行的，它也可以有服務集團渲染等等。

這些后續我們再慢慢講，這些我就不說了，就是說你要知道vivo是一個，漸進式的框架。它的優勢就是可以在sml頁面中使用，單獨的頁面中使用也可以把它某一個功能提取出來，用 vivo 來實現，甚至可以整個項目完全用 vivo 來實現。

當然日后的開發是第三者，就是完全整個項目都用 vivo 實現，這是比較常見的或者說這是需求，正常應用都是這個樣子的。

接下來要給大家聊一聊關于 vivo 的版本問題，因為這也是大家比較關心的，之前也是錄了很多很多視頻，但是版本比較老，所以現在做更新。

來說 vivo 版本，目前在開發中 vivo 有兩大版本，分別是 vivo 2和 vivo 3，老項目一般都是 vivo 2的，為什么？因為老的項目可能持續了半年、一年、兩年，這些項目出現的時候 vivo 3還沒存在，還沒有，所以它用的是 vivo 2的版本開發的，而現在的新項目一般都會選擇 vivo 3來開發。

本套課程講解的是哪個版本是 vivo 3的版本？有同學說老師，那 vivo 2怎么辦？不要急，因為 vivo 3涵蓋了 vivo 2的知識體系，就是說你把 vivo 3學會了 vivo 2你也就會了，但如果你只學 vivo 2 vivo 3你是不會的，為什么？因為 vivo 3增加了很多新的特性，所以說大家不用考慮說老師我們講 vivo 3的 vivo 2怎么辦這個問題，只要我們講了 vivo 3 vivo 2也涵蓋在其中了。

這就意味著無論是咱們在公司工作中是老項目還是新項目都沒有關系，你都可以勝任，都是可以的。這是我們來描述 vivo 的一個版本的一個主要原因。

這里再給大家介紹關于 view 的官方文檔，大家怎么去找官方文檔？它的官方文檔叫 cinder view gs.alg，這里加一個點在這里，官方文檔，我也希望把這個給大家放在這里，別大家地址到時候還不知道 vivo 的官方文檔是什么，前面有個 cn，其實在官方文檔就是 vivo gs的奧格前面有個 cn，cn 是什么意思？中文的。

當然有同學說老師我想看英文的，那你就把 c 音去掉，訪問的他就是個英文的，我個人肯定是看中文的了，為什么我英文又不好，是不是？在座各位英文好可以看英文的，也是鍛煉自己的英文閱讀文檔的水平，因為其實很多框架很。這個技術、知識第一手資料基本上都是英文的包含。

view，開發者是中國人，第一個版本提供的仍然是vi，仍然是英文的，為什么？因為它針對的不只有中國，還有很多其他國家，畢竟英文現在是什么？這世界統一語言，所以如果大家能讀得懂英文建議讀英文，如果英文對你學習來說是個障礙，那就先看英文，中文會了之后再慢慢去琢磨英文版本對應的描述，對不對？

這是它的官網，默認的就是已經三的版本了，如果大家以后想看二的版本，點文檔這里也有個二的版本，也是可以看的，這是它的官方文檔，也給大家放在這里了。

關于vivo這個簡介說到這里就可以了，本節課主要了解了三個點。

·第一個點就是關于vivo的一些描述，就是這里面的一個簡介，它的讀法等等。

·第二個就是為什么它叫漸進式框架？也剛說了其實就是atvo頁面中也可以使用，單獨一個功能模塊也可以使用，完整的項目用vivo也可以，它是逐漸增強的一個過程。

然后它有兩個大的版本，也熟知了有vivo 二的版本、vivo 三的版本，如何去判斷？日后創建好項目大家就能判斷了，我會告訴大家如何去判斷這是vivo 二的版本還是vivo 三的版本，不要急。

關于vivo的簡介就說到這里，感謝各位聆聽，下期再見。