-
step函數，它可以傳入2個參數，第一個是大于零的整數，他是將間隔動畫等分成指定數目的小間隔動畫，然后根據第二個參數顯示效果。 第二個參數設置后和step-start，step-end同義，在鳳城的小間隔動畫中判斷顯示，可以看出：step-start等于steps（1，start）， steps（1，end）等于step-end timing-function作用于每兩個關鍵幀之間，不是整個動畫查看全部
-
animation-iteration-count 屬性定義動畫播放次數查看全部
-
父級 perspective 子級 transform-style:preserve-3d(軸) 孫元素 transform: rotateY(120deg) 傾斜角度 translateZ(2.5rem) 透視距離 scaleY(.9) rotateY與 rotate的區別查看全部
-
DOMContentLoaded事件：頁面文檔完全加載并解析完畢后，會觸發DOMContentLoaded事件，HTML文檔不會等待樣式文件，圖片文件，子框架文件的加載查看全部
-
resize：調整瀏覽器窗口大小觸發resize事件查看全部
-
orientationchange事件是用戶水平或者垂直翻轉設備時觸發的事件， 例子：$(window).on("orientationchange",function(){ alert("方向已經改變") })查看全部
-
rem和em一樣都是相對單位，不同的是em是相對于元素的父元素的font-size進行計算，rem是相對于根元素html的font-size進行計算，這樣rem就繞開了復雜的層級關系，瀏覽器默認字體大小是16px，按照轉換關系，16px=1rem查看全部
-
修改background-size和background-position的值即可查看全部
-
1. z-index 屬性設置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。 2.-moz代表firefox瀏覽器私有屬性 -ms代表IE瀏覽器私有屬性 -webkit代表chrome、safari私有屬性 3.firefox瀏覽器不支持background-position-x，使用background-position ok查看全部
-
默認情況下瀏覽器的字體大小為16px，16px=1rem。20*(docEl.clientWidth / 320)意思是 獲取當前屏幕寬度除以16（20/320） 得到的是字體放大或縮小的倍率。當你改變20或320時 實質改變的是字體的放大倍率 兩者的比值越小 字體放大的倍率越大 反之亦然查看全部
-
關鍵幀動畫： CSS3的Animation有八個屬性 animation-name ：動畫名 animation-duration：時間 animation-delay：延時 animation-iteration-count：次數 animation-direction：方向 animation-play-state：控制 animation-fill-mode：狀態 animation-timing-function：關鍵幀變化 8個屬性中，其中1-7都有相關介紹，但是animation-timing-function是控制時間的屬性，在取值中除了常用到的 三次貝塞爾曲線 以外，還有個很高級的 steps() 函數，steps函數也就是整個圣誕主題的關鍵知識點。steps要配合精靈圖使用，簡單來說就是用來切換多個精靈圖的，形成幀動畫，類似setTimeout的處理感覺查看全部
-
rem和em單位一樣，都是一個相對單位,不同的是em是相對于元素的父元素的font-size進行計算,rem是相對于根元素html的font-size進行計算,這樣一來rem就繞開了復雜的層級關系，實現了類似于em單位的功能。默認情況下瀏覽器給的字體大小是16px，按照轉化關系 16px = 1rem. 自適應處理： 使用rem布局的時候,為了兼容不同的分辨率,我們應該要動態的修正根字體的大小,讓所有的用rem單位的子元素跟著一起縮放,從而達到自適應的效果查看全部
-
精靈動畫部分依舊采用大量的 CSS3 animation動畫的steps關鍵幀，但是不同的是，解決了自適應雪碧圖的問題 元素運動部分優化了CSS3過渡與變換的使用 新增了video視頻元素的使用 新增了3d旋轉木馬的效果實現 新增了canvas版的雪花實現查看全部
-
采用新的rem布局代替百分比布局方案 采用簡單的面向對象編程 類的形式對每一個頁面場景元素都做了一定的封裝 引入了觀察者模式的處理機制 引入了svg概念，通過svg繪制矢量圖查看全部
-
在設置一個容器的transform-style:preserve-3d;只影響這個元素的子元素。（子元素） perspective：100px;應該就是z軸的距離，眼睛距屏幕的距離。（父元素）查看全部
舉報
0/150
提交
取消