爱意满满的作品展示区。
alphardex

业余时间开发了 aqua.css——一个轻量级纯 CSS 框架

  •  3
     
  •   alphardex ·
    alphardex · Mar 27, 2020 · 6238 views
    This topic created in 2412 days ago, the information mentioned may be changed or developed.

    官网: https://aquacss.netlify.com/

    前言

    当今,大部分前端都过度注重于 JS 框架的学习,而忽略了原生的 HTML 和 CSS 。写的组件大部分都是过度封装,维护起来非常吃力,并且可扩展性也差。但是,倘若学好了 HTML 和 CSS,很多组件也就可以摆脱 JS,从而让 UI 能充分地表现自己,而不是在一坨翔山上艰难地爬行。

    aqua.css

    aqua.css 是笔者开发的一个轻量级的纯 CSS 框架。她有 3 大特征:易用、易定制、有趣。

    易用

    诸如 React 、Vue 之类框架一概不需掌握,参照组件 demo 复制粘贴就能跑出效果来。

    易定制

    阅读本项目源码你会发现许多 CSS 变量,它们往往决定了组件的色彩,如果你想“换肤”,只需用不同的颜色变量覆盖即可

    有趣

    本项目用到了很多有趣且实用的 CSS 技巧,非常适合学习

    25 replies  •  2020-05-12 22:04:24 +08:00
    xiaoz
    xiaoz
    Mar 27, 2020
    1
    已收藏,支持开源。
    iwuzhuo
    iwuzhuo
    Mar 27, 2020
    2
    支持。 建议:希望能做到和 bootstrap 之类的框架兼容,这类 css 框架非常是用来弥补 bootstrap 框架的不足
    guolaopi
    guolaopi
    Mar 27, 2020
    3
    已收藏 + star,谢谢分享
    guolaopi
    guolaopi
    Mar 27, 2020
    4
    另外,官网显示的 Gauge 仪表盘组件在 FireFox 显示不正常,FireFox 版本 74.0
    B1ankCat
    B1ankCat
    Mar 27, 2020
    5
    我和设计师差了一双能识别出颜色的眼睛
    B1ankCat
    B1ankCat
    Mar 27, 2020
    6
    @B1ankCat 嗯,还有能画出圆的手
    hzlzh
    hzlzh
    Mar 27, 2020
    7
    看起来很不错啊。
    Loading 加载 的 dom 有些多,是否可以尝试一下用伪元素来精简呢?
    YunYouJun
    YunYouJun
    Mar 27, 2020
    8
    兹辞,素晴爱了。
    guolaopi
    guolaopi
    Mar 27, 2020
    9
    dialog 在 FireFox 也不正常,报错了:TypeError: document.querySelector(...).showModal is not a function
    suruis
    suruis
    Mar 27, 2020
    10
    已收藏,学习学习。
    Justin13
    Justin13
    Mar 27, 2020 via Android
    11
    支持,特别佩服精通 CSS 的大神,我愿称之为“绝活”
    aydd2004
    aydd2004
    Mar 27, 2020 via iPhone
    12
    已收藏 周末用一下看看
    seekfire
    seekfire
    Mar 27, 2020
    13
    不错,支持一下
    dyxang
    dyxang
    Mar 28, 2020 via Android
    14
    喔,不正经 css ( bushi ),请问那个阿库娅的图哪来的?😏
    tyrik
    tyrik
    Mar 28, 2020 via iPhone
    15
    厄里斯的胸部是垫出来的!
    Austin2035
    Austin2035
    Mar 28, 2020
    17
    厉害,大佬厉害。
    greatghoul
    greatghoul
    Mar 28, 2020
    18
    为美好的世界献上祝福!
    40EaE5uJO3Xt1VVa
    40EaE5uJO3Xt1VVa
    Mar 28, 2020
    19
    大佬大佬爱了爱了,就等这种。期待更多样式
    haozi3156666
    haozi3156666
    Mar 28, 2020
    20
    优秀啊
    senher
    senher
    Mar 30, 2020
    21
    很实用,赞
    component
    component
    Mar 31, 2020
    22
    收藏学习一下
    commoccoom
    commoccoom
    May 12, 2020
    23
    codepen.io 已拒绝连接,是我本地网络的问题吗?
    alphardex
    alphardex
    OP
    May 12, 2020 via iPhone
    24
    @commoccoom codepen 在国内访问速度偏慢,如果要看 demo 的话可以直接 clone 本项目,里面有个 demo 文件夹
    commoccoom
    commoccoom
    May 12, 2020
    25
    @alphardex 好的,谢谢!
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   4984 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 64ms · UTC 09:07 · PVG 17:07 · LAX 01:07 · JFK 04:07
    ♥ Do have faith in what you're doing.