<tbody id="5vw1z"></tbody>
<rp id="5vw1z"></rp>
  •  

    好用的前端 CSS 工具庫(建議收藏)

    我們在做前端開發時,我們經常會將一些常用的代碼塊、功能塊進行封裝,為的是更好的復用。那么,被抽離出來獨立完成功能,通過API或配置項和其他部分交互,便形成了插件。

    下面這些是我在工作中積累的一些常用的前端開源插件,這里只是羅列出來,詳細的用法各個插件官網都有介紹。注意:往往一個解決方案會有多個插件,需要讀者根據自己的實際業務需求進行甄別選用,歡迎留言交流和補充。

    CSS PIN

    CSS Spinners?和?Loaders?– 模塊化、可定制和單一的 HTML 元素代碼。

    地址:點擊這里

    CSS PIN

    shepherd

    shepherd 用于引導您的用戶瀏覽您的應用。

    地址:點擊這里

    shepherd

    particles.js

    particles.js 用于創建粒子的輕量級 JavaScript 庫。

    地址:點擊這里

    particles.js

    Happy Hues

    Happy Hues?是一個調色板靈感網站。項目中需求中開發多主題的話可以參考一下。

    地址:點擊這里

    Happy Hues

    Glassmorphism

    Glassmorphism?是一種設計風格,,用于實現 UI 中“磨砂玻璃”效果。

    地址:點擊這里

    Glassmorphism

    Utopia

    Utopia?一種思考流體響應式設計思想。

    地址:點擊這里

    Utopia

    Specificity Visualizer

    通過工具您可以通過鳥瞰圖快速了解 CSS 文件中的選擇器及其特性。

    地址:點擊這里

    Specificity Visualizer

    Reseter.css

    結合Normalize.css?和?reset.CSS的替代方案。

    優點:不會刪除所有瀏覽器樣式,而是重新定義有用的樣式,大小只有**~0.7kb**

    地址:點擊這里

    Reseter.css Reseter.css

    MoreToggles.css

    MoreToggles.css一個純 CSS 庫,為您提供各種好看的切換開關。

    地址:點擊這里

    MoreToggles.css

    Charts.css

    Charts.css?是一個用于數據可視化的開源 CSS 框架。

    地址:點擊這里

    Charts.css

    Optimizt

    OptimiztCLI命令去優化圖像的工具。它可以壓縮?PNG、JPEG、GIF?和?SVG?有損和無損,并為光柵圖像創建?AVIF?和?WebP?版本。

    以后需要優化圖片時候,只需要在項目中運行script命令就快速生成WebP圖片格式簡單有便捷。

    地址:點擊這里

    Optimizt

    Halfmoon

    具有內置暗模式和使用 CSS 變量的完全可定制性的前端框架;非常適合構建儀表板和工具。

    地址:點擊這里

    Halfmoon

    Meanderer

    用于響應式 CSS 運動路徑的 JavaScript 微型庫!

    地址:點擊這里

    Meanderer

    「點點贊賞,手留余香」

    5

    給作者打賞,鼓勵TA抓緊創作!

    微信微信 支付寶支付寶

    還沒有人贊賞,快來當第一個贊賞的人吧!

    聲明:
    1. 本站所有文章教程及資源素材均來源于網絡與用戶分享或為本站原創,僅限用于學習和研究。
    2. 如果內容損害你的權益請聯系客服QQ:1642748312給予處理。
    碼云筆記 » 好用的前端 CSS 工具庫(建議收藏)

    發表回復

    IT互聯網行業相關廣告投放 更專業 更精準

    立即查看 聯系我們
    亚洲 自拍 另类小说综合图区