認識網(wǎng)頁和網(wǎng)站
什么是網(wǎng)頁?
網(wǎng)頁的專業(yè)術語叫做 Web Page;
打開瀏覽器查看到的頁面洁奈,是網(wǎng)絡中的一“頁”;
網(wǎng)頁的內(nèi)容可以非常豐富:包括文字诊赊、鏈接、圖片夺谁、音樂、視頻等等
網(wǎng)站是什么呢?
- 網(wǎng)站是由多個網(wǎng)頁組成的; p通常一個網(wǎng)站由N個網(wǎng)頁組成(N >= 1);
網(wǎng)頁的顯示過程 – 用戶角度
1.用戶在瀏覽器輸入一個網(wǎng)站;
2.瀏覽器會找到對應的服務器地址肉微,請求靜態(tài)資源(可以存放在世界上任何一個地方);
3.服務器返回靜態(tài)資源給瀏覽器;
4.瀏覽器對靜態(tài)資源進行解析和展示;
網(wǎng)頁的顯示過程 – 前端工程師
1.開發(fā)項目(HTML/CSS/JavaScript/Vue/React)
2.打包匾鸥、部署項目到服務器里面
服務器是什么?
-
我們?nèi)粘I罱佑|到的基本都屬于****客戶端****、前端的內(nèi)容:
- 比如瀏覽器碉纳、微信勿负、QQ、小程序;
-
我們知道自己的手機并不可能存放哪些多的數(shù)據(jù)和資源:
- 比如你用《網(wǎng)易云聽音樂》劳曹,音樂數(shù)據(jù)大部分都是存在“服務器”中的;
-
那么服務到底是什么呢?
服務器本質(zhì)上也是一臺類似于你電腦一樣的主機;
但是這個主機有幾個特點:
?? 二十四小時不關機的(穩(wěn)定運行); ?? 沒有顯示器的; ?? 一般裝的是Linux操作系統(tǒng)(比如centos);
公司大部分用的是****云服務器****(比如阿里云奴愉、騰訊云攒至、華為云);
世界上第一個網(wǎng)頁
-
上世紀90年代,Berners-Lee上線了世界上第一個網(wǎng)站:
- 雖然目前我們會認為這個網(wǎng)頁簡單到不值一提躁劣,但是在當時它的發(fā)明是“天才之作”迫吐。
現(xiàn)代的網(wǎng)頁已經(jīng)非常復雜
網(wǎng)頁的組成
那么網(wǎng)頁是由什么開發(fā)出來的呢?
階段一:HTML元素;
階段二:HTML元素 + CSS樣式;
階段三:HTML元素 + CSS樣式 + JavaScript語言;
網(wǎng)頁的組成
網(wǎng)頁的組成
網(wǎng)頁源代碼的角度
網(wǎng)頁開發(fā)的角度
瀏覽器的作用
我們已經(jīng)明確知道了網(wǎng)頁的組成部分:HTML + CSS + JavaScript****。
那么這些看起來枯燥的代碼账忘,是如何被渲染成多彩的網(wǎng)頁呢?
我們知道是通過瀏覽器來完成;
瀏覽器最核心的部分其實是 “瀏覽器****內(nèi)核****”;
瀏覽器的渲染引擎
瀏覽器最核心的部分是渲染引擎(Rendering Engine)志膀,一般也稱為“****瀏覽器****內(nèi)核****”
負責解析網(wǎng)頁語法,并渲染(顯示)網(wǎng)頁 n 常見的瀏覽器有很多:
不同瀏覽器的****內(nèi)核
-
常見的瀏覽器內(nèi)核有
Trident ( 三叉戟):IE鳖擒、360安全瀏覽器溉浙、搜狗高速瀏覽器、百度瀏覽器蒋荚、UC瀏覽器; pGecko( 壁虎) :Mozilla Firefox;
Presto(急板樂曲)-> Blink (眨眼):Opera
Webkit :Safari戳稽、360極速瀏覽器、搜狗高速瀏覽器期升、移動端瀏覽器(Android惊奇、iOS) pWebkit -> Blink :Google Chrome
- 不同的瀏覽器內(nèi)核有不同的解析、渲染規(guī)則播赁,所以同一網(wǎng)頁在不同內(nèi)核的瀏覽器中的渲染效果也可能不同颂郎。