平滑的關(guān)鍵在于定義transition過(guò)渡時(shí)間,實(shí)際上設(shè)計(jì)邏輯類似于輪播圖,把內(nèi)容頁(yè)按順序排列,每個(gè)內(nèi)容頁(yè)寬高都是100%撐滿屏幕,在通過(guò)fixed在底部定義標(biāo)簽卡,接下來(lái)其實(shí)也可以通過(guò)js定義點(diǎn)擊事件,在點(diǎn)擊標(biāo)簽卡時(shí)切換css樣式名來(lái)過(guò)渡到對(duì)應(yīng)的內(nèi)容頁(yè),因?yàn)閏ss中定義了transition ,所以在用戶看來(lái)就是平滑過(guò)渡
2021-05-14
<meta name="viewpoint"content="width=device-width,initial-scale=1"> 設(shè)置網(wǎng)頁(yè)自適應(yīng)屏幕且不允許用戶縮放
2020-03-03
<meta http-equiv="X-UA-Compatible" content="IE-edge,Chrome=1"> 告訴瀏覽器采用最新渲染機(jī)制
2020-03-03
老師講的非常詳細(xì)也非常動(dòng)聽,聲音太溫柔了,和聽ASMR一樣,我都快睡著了。這堂課讓我長(zhǎng)見識(shí)了,原來(lái)純運(yùn)用CSS也能做到操作頁(yè)面行為。給老師點(diǎn)個(gè)贊?。
2019-03-19
https://codepen.io/daivd_dai/project/editor/XoLLLK,我實(shí)現(xiàn)的代碼,沒有字體庫(kù),大家可以參考哈
2018-11-26
制作大三角形時(shí),正方形旋轉(zhuǎn)45度后變?yōu)榱庑?,菱形高度的一半不等于原正方形高度的一半,此時(shí)top不應(yīng)該設(shè)為原正方形的-50%,應(yīng)該重新計(jì)算,這里細(xì)節(jié)需要處理。
2018-11-05