網頁亂碼是怎樣產生的
- 網站頭部設定的編碼和網頁本身的編碼不一致導致的
<head>
<meta chaeset = utf-8>
</head>
如果網站制作者將網頁文件存儲為了gbk格式,然后在網頁頭部卻設置了utf-8的格式,那么瀏覽器在讀取網頁的時候就會將中文或其他非英文和數字的字符解析成亂碼
解決辦法很簡單,將解碼方式和文件存儲的編碼修改成一致即可
- 不合理的字符串截取造成個別字符亂碼
在gbk和gb2312編碼下,中文是占用兩個字節,而在utf-8編碼模式下,中文字符占用三個字節,而英文和數字都是占用一個字節,如果用英文的一些截取方式去截取中文字符的話,就可能出現將一個中文截斷的現象,網頁就會出現中文亂碼,而gbk和utf-8的中文截取手段也不一樣。
這種情況的解決辦法就是規范截取字符串的函數,因地制宜
顏色有幾種寫法, 紅色、 綠色、藍色、白色、黑色如何表示? 透明黑色如何表示?#ccc的顏色, #eee的顏色? #333的顏色?
-
顏色的寫法
- 十六進制色
- 十六進制顏色是這樣規定的:#RRGGBB,其中的 RR(紅色)、GG(綠色)、BB(藍色)十六進制整數規定了顏色的成分。所有值必須介于 0 與 FF 之間
- 十六進制色
舉例說,#0000ff 值顯示為藍色,這是因為藍色成分被設置為最高值(ff),而其他成分被設置為 0。
- RGB 顏色
- RGB 顏色值是這樣規定的:rgb(red, green, blue)。每個參數 (red、green 以及 blue) 定義顏色的強度,可以是介于 0 與 255 之間的整數,或者是百分比值(從 0% 到 100%)。
>舉例說,rgb(0,0,255) 值顯示為藍色,這是因為 blue 參數被設置為最高值(255),而其他被設置為 0
- RGBA 顏色
- RGBA 顏色值是 RGB 顏色值的擴展,帶有一個 alpha 通道 - 它規定了對象的不透明度。
RGBA 顏色值是這樣規定的:rgba(red, green, blue, alpha)。alpha 參數是介于 0.0(完全透明)與 1.0(完全不透明)的數字
p {
background-color:rgba(255,0,0,0.5);
}
- HSL 顏色
- HSLA 顏色
- 預定義/跨瀏覽器顏色名
- ###紅色、 綠色、藍色、白色、黑色如何表示?
顏色名 | 十六進制顏色值 | 顏色 RGB
:----:|:------:|:------:|
red | #FF0000 |rgb(255,0,0)
green| #00FF00 |rgb(0,255,0)
blue | #0000FF |rbg(0,0,255)
white | #FFFFFF|rbg(255,255,255)
black | #000000 | rbg(0,0,0)
- ###透明黑色怎么寫?
由RGBA 顏色可得
> `rgba(0,0,0,0)`
- ###ccc的顏色, #eee的顏色? #333的顏色?
-

-

-

##<!doctype html> 的作用是什么
>- <!doctype html>是告訴瀏覽器當前頁面是使用html5版本進行編寫的
- <!doctype html>不是標簽,而是聲明,必須放在html文檔的第一行
- 文檔類型聲明對大小寫不敏感
##嚴格模式和混雜模式指什么?
>- 文檔類型事先聲明,告訴瀏覽器以特定標準去渲染文件,即嚴格模式;
- 如果沒有聲明,則瀏覽器以自己的標準去渲染文件,即混雜模式;
##meta 有什么作用,常見的值有哪些?
>- <meta>標簽定義html文檔的元數據,具有描述網頁內容的作用,常用于 SEO及記錄頁面的主干信息;
- <meta>通常以名稱/值對出現
常見名/值包括:


- http-equiv:相當于http的頭文件,在向瀏覽器傳輸html文檔時先傳遞特定的信息以輔助頁面顯示
###<meta http-equiv="X-UA-compatible" content="IE=edge,chrome=1">有什么作用?

- 這個屬性主要是設置瀏覽器優先使用什么模式來渲染頁面的
- 以上代碼IE=edge告訴IE使用最新的引擎渲染網頁,chrome=1則可以激活Chrome Frame
##常見的瀏覽器有哪些,什么內核?
>- 瀏覽器的內核可分為渲染引擎(排版引擎)和JS引擎
- 渲染引擎就是解析并執行Html和Css來渲染頁面的;
- JS引擎就是解析并執行JavaScript的;
- 由于不同的瀏覽器使用的內核不一,導致同一頁面的渲染效果會產生差異,因此作為前端工程師要特別注意不同瀏覽器內核的特征。
>>- 渲染引擎:Mosaic -> Trident
- JS引擎:WebGL(JavaScript和OpenGL ES 2.0的結合)
代表: IE系列瀏覽器
***
- 渲染引擎:Gecko
- JS引擎:spiderMonkey
代表:FireFox系列瀏覽器;Netcape 6
***
- 渲染引擎:Presto(已棄用)
- JS引擎:無記錄
代表:Opera系列瀏覽器
***
- 渲染引擎:KHTML->WebCore->WebKit->Webkit2
- JS引擎:KJs->JScore
代表:Safari;Chrome
***
- 渲染引擎:WebKet->Blink
- JS引擎:JScore->V8
代表:Chrome;Blink