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