動畫的定義
由許多靜止的畫面 (幀)
肉眼因視覺殘象產生錯覺
而誤以為是活動的畫面 概念
幀：每個靜止的畫面都叫做幀
css是怎樣實現動畫的
使用transform屬性
四個常用功能
位移 translate
縮放 scale
旋轉 rotate
傾斜 skew
translate 常用寫法
translatex() 水平移動
translatey() 垂直移動
translate(, ?) 水平 和 錘子 移動
translatez() 且父容器 perspective 平面大小移動
translate3d(x,y,z) 3d 離螢幕更近
transform 之 scale
scalex() 水平變大縮小
scaley() 垂直變大縮小
scale(,) 水平垂直變大縮小
transform 之 rotate
rotate([| ])
rotatez([| ])
rotatex([| ])
rotatey([| ])
transform 之 skew
skewx([| ])
skewy([| ])
skew([| ],[| ]?)
根據css構建css樹(cssom)
將兩棵樹合併成一顆渲染樹(render tree)
layout布局(文件流、盒模型、計算大小和位置)
paint繪製(把邊框顏色、文字顏色、陰影等畫出來)
compose合成(根據層疊關係展示畫面)
瀏覽器渲染過程
瀏覽器的渲染過程 第一步 html經過html parser p s 解析為dom tree 第二步 css根據css規則經過css解析器解析為style rules cssom tree 第三步 兩棵樹經過attachment結合為 render tree 形成一棵大樹,此時它還是一棵迷茫的樹，不...
瀏覽器渲染過程
1.頁面準備 2.重定向 在header定義了重定向才會有這個過程，如果沒有就不會產生這個過程 關於重定向的分析 4.dns解析 把網域名稱解析成ip，如果直接用ip位址訪問，不會產生這個過程 5.tcp連線 6.request header 請求頭資訊 7.request body 請求體資訊，比...
瀏覽器渲染過程
這個過程可以大致分為兩個部分 網路通訊和頁面渲染。輸入url按下回車之後，瀏覽器會去瀏覽器快取中尋找該url的ip 沒有的話去系統快取中找，還是沒有的話去路由器快取中尋找 再沒有就去系統host檔案中找，還是沒有最後只能去請求dns伺服器，然後dns給乙個ip給瀏覽器 瀏覽器根據這個ip位址，向伺服...