相關(guān)文章

• 用一個(gè)div畫(huà)出關(guān)閉圖標(biāo)

  摘要：今天實(shí)現(xiàn)一個(gè)用一個(gè)來(lái)實(shí)現(xiàn)關(guān)閉按鈕圖標(biāo)，其中主要用到的技巧偽元素的同時(shí)讓該圖標(biāo)居中，此次是用了彈性布局。樣式如下主要用到利用的偽元素和的轉(zhuǎn)換角度效果圖 今天實(shí)現(xiàn)一個(gè) 用一個(gè)div來(lái)實(shí)現(xiàn)關(guān)閉按鈕圖標(biāo)，其中主要用到的技巧：css3偽元素:before,:after,css3的transform:rotate(),同時(shí)讓該圖標(biāo)居中，此次是用了flex彈性布局。css樣式如下： html,bod...

  neuSnail 2019-08-29 12:23 評(píng)論0 收藏0

• 使用CSS畫(huà)個(gè)圖標(biāo)

  摘要：具體樣式如下繪制圖標(biāo)三當(dāng)我們能深入理解一些屬性的時(shí)候，實(shí)現(xiàn)一些復(fù)雜的圖標(biāo)完全不是難事無(wú)非就是將簡(jiǎn)單的圖形組合起來(lái)。 CSS繪制圖標(biāo)（一） 我們使用單個(gè)標(biāo)簽繪制一個(gè)文件的圖標(biāo)。HTML內(nèi)容很簡(jiǎn)單，就一句話。 右上角折疊三角采用after偽元素實(shí)現(xiàn)，左下角文字使用before偽元素實(shí)現(xiàn)。主體部分當(dāng)然還是div#doc。 具體CSS樣式如下： #doc { position: ...

  沈建明 2019-08-29 15:26 評(píng)論0 收藏0

• FE.WX-小程序“無(wú)聊廣場(chǎng)”游戲前端性能優(yōu)化與踩坑攻略

  摘要：本文主要針對(duì)小程序無(wú)聊廣場(chǎng)的前端開(kāi)發(fā)內(nèi)容做總結(jié)，記錄常見(jiàn)的一些老生常談的進(jìn)階手法，對(duì)小程序中的動(dòng)畫(huà)音頻等踩坑做出解決方案。 背景 一個(gè)交互不復(fù)雜，對(duì)刷新頻率和動(dòng)畫(huà)效果要求不高的小游戲，不需要使用canvas主導(dǎo)的解決方案，使用dom操作一樣可以完成。節(jié)省了cocos creater的學(xué)習(xí)成本，值得一試。本文主要針對(duì)小程序無(wú)聊廣場(chǎng)的前端開(kāi)發(fā)內(nèi)容做總結(jié)，記錄常見(jiàn)的一些老生常談的進(jìn)階手法，對(duì)...

  qpal 2019-08-22 18:26 評(píng)論0 收藏0