1. 程式人生 > >web前端篇(2)—— 前端技術介紹

web前端篇(2)—— 前端技術介紹

前端技術

前文了解了什麼是前端,那麼前端技術到底有哪些呢?最核心的就這三個:

  • html/html5
  • css/css3
  • javascript

 

 

什麼是HTML

 

HyperText Markup Language,超文字標記語言,標準通用標記語言下的一個應用

 

那麼超文字標記語言又是什麼呢 ?哈哈,沒完沒了是吧,學習就是要這種沒完沒了的勁。

超級文字標記語言是標準通用標記語言下的一個應用,也是一種規範,一種標準, 它通過標記符號來標記要顯示的網頁中的各個部分。

網頁的本質就是超級文字標記語言,通過結合使用其他的Web技術(如:指令碼語言、公共閘道器介面、元件等),可以創造出功能強大的網頁

 

如果朋友們如果不信的話,你瀏覽器開啟百度首頁,然後在任意空白位置,滑鼠右鍵-檢視原始碼:

 

然後會開啟一個新的介面:

 

 好的,下面黑色的字元暫時不看,看那些有顏色的字元,<html>,<head>,<link>這些之類的字元就是超文字標記語言,而網頁就是這些超文字標記語言組合而成的,在後面的文章我們就會詳細的介紹html

 

html5

html的第五次重大改進版,支援Html5的瀏覽器包括Firefox(火狐瀏覽器),IE9及其更高版本,Chrome(谷歌瀏覽器),Safari,Opera等;國內的傲遊瀏覽器(Maxthon),以及基於IE或Chromium(Chrome的工程版或稱實驗版)所推出的360瀏覽器、搜狗瀏覽器、QQ瀏覽器、獵豹瀏覽器等國產瀏覽器同樣具備支援HTML5的能力

 

html5在移動端的前端頁面設計很佔優勢,在移動裝置開發HTML5應用只有兩種方法,要不就是全使用HTML5的語法,要不就是僅使用JavaScript引擎,這個你可以想一想,JS是很牛氣的,在移動端html5能js相提並論,這個功用性不用多說了

 

HTML5手機應用的最大優勢就是可以在網頁上直接除錯和修改。原先應用的開發人員可能需要花費非常大的力氣才能達到HTML5的效果,不斷地重複編碼、除錯和執行,這是首先得解決的一個問題。因此也有許多手機雜誌客戶端是基於HTML5標準,開發人員可以輕鬆除錯修改

 

然後如果你是網路重度使用者,尤其是經常看視訊,相信你應該見過html5加速吧,是的,他還可以很好的支援視訊播放之類的。總之功能很強大

 

 

什麼是css

 Cascading Style Sheets,層疊樣式表,是一種用來表現HTML(標準通用標記語言的一個應用)或XML(標準通用標記語言的一個子集)等檔案樣式的計算機語言。CSS不僅可以靜態地修飾網頁,還可以配合各種指令碼語言動態地對網頁各元素進行格式化。

CSS 能夠對網頁中元素位置的排版進行畫素級精確控制,支援幾乎所有的字型字號樣式,擁有對網頁物件和模型樣式編輯的能力

 

還是上面那個截圖,下面那些黑色的字元就是css

 

這個css會在html介紹完之後就會介紹

 

css3

css3是css的升級版,主要包括了盒子模型、列表模組、超連結方式、語言模組、背景和邊框、文字特效、多欄佈局等模組,在css的基礎上有了很多新的功能和樣式。 CSS演進的一個主要變化就是W3C決定將CSS3分成一系列模組。瀏覽器廠商按CSS節奏快速創新,因此通過採用模組方法,CSS3規範裡的元素能以不同速度向前發展,因為不同的瀏覽器廠商只支援給定特性。但不同瀏覽器在不同時問支援不同特性,所以這也讓跨瀏覽器開發變得複雜

 

在以後的css介紹中偶爾會用到一點點css3的特效

 

什麼是javascript

 

JavaScript簡稱js,它一種直譯式指令碼語言,是一種動態型別、弱型別、基於原型的語言,內建支援型別。它的直譯器被稱為JavaScript引擎,為瀏覽器的一部分,廣泛用於客戶端的指令碼語言,最早是在HTML(標準通用標記語言下的一個應用)網頁上使用,用來給HTML網頁增加動態功能。 在1995年時,由Netscape公司的Brendan Eich,在網景導航者瀏覽器上首次設計實現而成。因為Netscape與Sun合作,Netscape管理層希望它外觀看起來像Java,因此取名為JavaScript。但實際上它的語法風格與Self及Scheme較為接近。
為了取得技術優勢,微軟推出了JScript,CEnvi推出ScriptEase,與JavaScript同樣可在瀏覽器上執行。為了統一規格,因為JavaScript兼容於ECMA標準,因此也稱為ECMAScript

 

其實,web前端裡最重要的就是javascript,這個在css介紹之後會用大量的篇幅詳細的介紹它

 

html,css,js之間的關係

 

記住這句話:html是網頁結構,css是以什麼形式表現網頁結構,js控制網頁結構的行為

 

這個各位可能不能很好的理解,但跟著後面的文章,相信你會慢慢意會這句話