Web學習>>一些專業名詞

1.API

　　API（Application Programming Interface,應用程序編程接口）是一些預先定義的函數，目的是提供應用程序與開發人員基於某軟件或硬件得以訪問一組例程的能力，而又無需訪問源碼，或理解內部工做機制的細節。

2.瀏覽器的內核

　　瀏覽器最重要或者說核心的部分是「Rendering Engine」，可大概譯爲「渲染引擎」，不過咱們通常習慣將之稱爲「瀏覽器內核」。負責對網頁語法的解釋（如標準通用標記語言下的一個應用HTML、JavaScript）並渲染（顯示）網頁。 因此，一般所謂的瀏覽器內核也就是瀏覽器所採用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網頁的內容以及頁面的格式信息。不一樣的瀏覽器內核對網頁編寫語法的解釋也有不一樣，所以同一網頁在不一樣的內核的瀏覽器裏的渲染（顯示）效果也可能不一樣，這也是網頁編寫者須要在不一樣內核的瀏覽器中測試網頁顯示效果的緣由。

Ie(Ie內核) 火狐（Gecko） 谷歌（webkit） opear(Presto)

 3.W3C

• W3C 指萬維網聯盟（World Wide Web Consortium）
• W3C 建立於1994年10月
• W3C 由 Tim Berners-Lee 建立
• W3C 是一個會員組織
• W3C 的工做是對 web 進行標準化
• W3C 建立並維護 WWW 標準
• W3C 標準被稱爲 W3C 推薦（W3C 規範）

4.W3C規範的批准步驟

在 W3C 發佈某個新標準的過程當中，規範是經過下面的嚴格程序由一個簡單的理念逐步確立爲推薦標準的：

1。W3C 收到一份提交

2。由 W3C 發佈一份記錄

3。由 W3C 建立一個工做組

4。由 W3C 發佈一份工做草案

5。由 W3C 發佈一份候選的推薦

6。由 W3C 發佈一份被提議的推薦

7。由 W3C 發佈推薦

5.優雅降級和漸進加強

　　漸進加強 progressive enhancement：針對低版本瀏覽器進行構建頁面，保證最基本的功能，而後再針對高級瀏覽器進行效果、交互等改進和追加功能達到更好的用戶體驗。

　　優雅降級 graceful degradation：一開始就構建完整的功能，而後再針對低版本瀏覽器進行兼容。

　　區別：優雅降級是從複雜的現狀開始，並試圖減小用戶體驗的供給，而漸進加強則是從一個很是基礎的，可以起做用的版本開始，並不斷擴充，以適應將來環境的須要。降級（功能衰減）意味着往回看；而漸進加強則意味着朝前看，同時保證其根基處於安全地帶。

6.清除浮動方法：

https://my.oschina.net/leipeng/blog/221125

7.web前端頁面性能優化小結 (http://www.cnblogs.com/mofish/archive/2010/10/12/1849041.html#undefined)

1、提倡前端開發工程師在書寫xhtml的時候作到結構語義化。

2、css，js文件數量及大小的優化

3、背景圖片數量及大小的優化

4、內容圖片的大小的優化

八、Coockie是什麼

http://www.cnblogs.com/soficircle/p/6898888.html

9.CSS hack大全

http://www.kwstu.com/Admin/ViewArticle/201409011604277330

10.png和jpg

做者：土老師
連接：https://www.zhihu.com/question/20028452/answer/13803642
來源：知乎
著做權歸做者全部。商業轉載請聯繫做者得到受權，非商業轉載請註明出處。

• png能夠儲存透明，完爆gif的地方在於失真小，沒鋸齒；劣勢是不支持動畫；
• png採用無損壓縮，在多數狀況下均可以保留圖片裏全部像素。PNG無損壓縮算法，簡單地說，就是把圖片裏出現的每個顏色都記錄下來。經過記錄這些顏色相對應的值記錄一張圖片。
• png分爲兩種，一種是Index，一種是RGB。Index記錄同一種顏色的值和出現的位置（簡單地說，好比一個2px*2px的超級小圖，從左往右從上往下依次的顏色是紅，白，白，紅，那麼記錄的方法就是「紅-1,4；白-2,3」）；而RGB圖則把全部像素的色值依次記錄下來（即「紅，白，白紅」）。對於相同的圖片，Index格式的尺寸老是小於RGB。

但除非圖片尺寸，顏色層次豐富，這時候可能會失真，由於不管PNG8仍是PNG24，儲存的索引色的數量都是有限的（PNG8最多儲存256個索引色，PNG24能夠儲存1600多萬個，但相應的尺寸也會更大。）這時候，反而用jpg會好一些。你問題中說的是小圖標，那麼就png是恰當的。

• jpg適用於攝影圖片，以及色彩豐富的圖片。它採用壓縮算法，會對圖片上每8px*8px的像素進行處理，經過強制漸變的方法來減少文件尺寸，所以不管選擇的儲存質量多高，仍是會多多少少失真一些，但對於攝影之類的圖片來講，jpg格式就會比png小不少了。

11.瀏覽器兼容問題

瀏覽器兼容問題一：不一樣瀏覽器的標籤默認的外補丁和內補丁不一樣

問題症狀：隨便寫幾個標籤，不加樣式控制的狀況下，各自的margin 和padding差別較大。

碰到頻率:100%

解決方案：CSS裏    *{margin:0;padding:0;}

備註：這個是最多見的也是最易解決的一個瀏覽器兼容性問題，幾乎全部的CSS文件開頭都會用通配符*來設置各個標籤的內外補丁是0。

瀏覽器兼容問題二：塊屬性標籤float後，又有橫行的margin狀況下，在IE6顯示margin比設置的大

問題症狀:常見症狀是IE6中後面的一塊被頂到下一行

碰到頻率：90%（稍微複雜點的頁面都會碰到，float佈局最多見的瀏覽器兼容問題）

解決方案：在float的標籤樣式控制中加入 display:inline;將其轉化爲行內屬性

備註：咱們最經常使用的就是div+CSS佈局了，而div就是一個典型的塊屬性標籤，橫向佈局的時候咱們一般都是用div float實現的，橫向的間距設置若是用margin實現，這就是一個必然會碰到的兼容性問題。

瀏覽器兼容問題三：設置較小高度標籤（通常小於10px），在IE6，IE7，遨遊中高度超出本身設置高度

問題症狀：IE六、7和遨遊裏這個標籤的高度不受控制，超出本身設置的高度

碰到頻率：60%

解決方案：給超出高度的標籤設置overflow:hidden;或者設置行高line-height 小於你設置的高度。

備註：這種狀況通常出如今咱們設置小圓角背景的標籤裏。出現這個問題的緣由是IE8以前的瀏覽器都會給標籤一個最小默認的行高的高度。即便你的標籤是空的，這個標籤的高度仍是會達到默認的行高。

瀏覽器兼容問題四：行內屬性標籤，設置display:block後採用float佈局，又有橫行的margin的狀況，IE6間距bug

問題症狀：IE6裏的間距比超過設置的間距

碰到概率：20%

解決方案：在display:block;後面加入display:inline;display:table;

備註：行內屬性標籤，爲了設置寬高，咱們須要設置display:block;(除了input標籤比較特殊)。在用float佈局並有橫向的margin後，在IE6下，他就具備了塊屬性float後的橫向margin的bug。不過由於它自己就是行內屬性標籤，因此咱們再加上display:inline的話，它的高寬就不可設了。這時候咱們還須要在display:inline後面加入display:talbe。

瀏覽器兼容問題五：圖片默認有間距

問題症狀：幾個img標籤放在一塊兒的時候，有些瀏覽器會有默認的間距，加了問題一中提到的通配符也不起做用。

碰到概率：20%

解決方案：使用float屬性爲img佈局

備註：由於img標籤是行內屬性標籤，因此只要不超出容器寬度，img標籤都會排在一行裏，可是部分瀏覽器的img標籤之間會有個間距。去掉這個間距使用float是正道。（個人一個學生使用負margin，雖然能解決，但負margin自己就是容易引發瀏覽器兼容問題的用法，因此我禁止他們使用）

瀏覽器兼容問題六：標籤最低高度設置min-height不兼容

問題症狀：由於min-height自己就是一個不兼容的CSS屬性，因此設置min-height時不能很好的被各個瀏覽器兼容

碰到概率：5%

解決方案：若是咱們要設置一個標籤的最小高度200px，須要進行的設置爲：{min-height:200px; height:auto !important; height:200px; overflow:visible;}

備註：在B/S系統前端開時，有不少狀況下咱們又這種需求。當內容小於一個值（如300px）時。容器的高度爲300px；當內容高度大於這個值時，容器高度被撐高，而不是出現滾動條。這時候咱們就會面臨這個兼容性問題。

瀏覽器兼容問題七：透明度的兼容CSS設置

作兼容頁面的方法是：每寫一小段代碼（佈局中的一行或者一塊）咱們都要在不一樣的瀏覽器中看是否兼容，固然熟練到必定的程度就沒這麼麻煩了。建議常常會碰到兼容性問題的新手使用。不少兼容性問題都是由於瀏覽器對標籤的默認屬性解析不一樣形成的，只要咱們稍加設置都能輕鬆地解決這些兼容問題。若是咱們熟悉標籤的默認屬性的話，就能很好的理解爲何會出現兼容問題以及怎麼去解決這些兼容問題。

/* CSS hack*/

我不多使用hacker的，多是我的習慣吧，我不喜歡寫的代碼IE不兼容，而後用hack來解決。不過hacker仍是很是好用的。使用hacker我能夠把瀏覽器分爲3類：IE6 ；IE7和遨遊；其餘（IE8 chrome ff safari opera等）

◆IE6認識的hacker 是下劃線_ 和星號 *

◆IE7 遨遊認識的hacker是星號 *

好比這樣一個CSS設置：

height:300px;*height:200px;_height:100px;

IE6瀏覽器在讀到height:300px的時候會認爲高時300px；繼續往下讀，他也認識*heihgt， 因此當IE6讀到*height:200px的時候會覆蓋掉前一條的相沖突設置，認爲高度是200px。繼續往下讀，IE6還認識_height,因此他又會覆蓋掉200px高的設置，把高度設置爲100px；

IE7和遨遊也是同樣的從高度300px的設置往下讀。當它們讀到*height200px的時候就停下了，由於它們不認識_height。因此它們會把高度解析爲200px，剩下的瀏覽器只認識第一個height:300px;因此他們會把高度解析爲300px。由於優先級相同且想衝突的屬性設置後一個會覆蓋掉前一個，因此書寫的次序是很重要的。