主流css框架

Bootstrap仍然是最流行的 CSS 框架之一。他们提供了大量的文档、示例和演示,可以帮你快速进行响应式 Web 开发。该框架的当前版本是 Bootstrap 5,相较于V4,做出了一些改变: 拥有了自己的SVG图标库 不再支持jquery 不再支持IE 增加了css自定义属性 增强的网格系统 Forms可被更新 传送门:


Bootstrap仍然是最流行的 CSS 框架之一。他们提供了大量的文档、示例和演示,可以帮你快速进行响应式 Web 开发。该框架的当前版本是 Bootstrap 5,相较于V4,做出了一些改变:

  • 拥有了自己的SVG图标库

  • 不再支持jquery

  • 不再支持IE

  • 增加了css自定义属性

  • 增强的网格系统

  • Forms可被更新

传送门:getbootstrap.com/

六、UIkit


相较于其他通用的css框架,UIkit有一些这些框架没有的组件,比如

  • Lightbox(利用模态对话框为图片和视频创建一个别致的灯箱)

  • Parallax(依赖于页面滚动条位置的动态 CSS 特性)

  • Nestable(创建可以通过拖拽排序的可嵌套式列表)

  • Sortable(创建可排序的网格和列表重新来排列元素的顺序)

传送门:getuikit.com/

七、Semantic UI


Semantic意为语义,由于Semantic UI类在命名上清晰易懂,因此开发人员不但节省了学习的时间,也让手头上项目的开发更快、更直观。此外布局的多样性是Semantic UI的另一个优势。通过不同的主题,您可以轻松地为各种项目找到必要的组件。

Semantic UI存在一些缺点,更新频率相较于其他热门框架较低,并且在某些设备运行响应能力一般。

传送门:semantic-ui.com/

八、Bulma


Bulma 是一个基于 Flexbox 的现代化的 CSS 框架。它提供了随时可用的前端组件,您可以轻松地组合这些组件来构建响应式 Web 界面。

和bootstrap相比,两者最大的区别是,bulma是纯css,没有js,bootstrap有JS。这里举个列布局的例子:

  1. 添加columns容器

  2. 添加任意数量的column元素

无论列数是多少,每一列的宽度相等

知秋君
上一篇 2024-08-15 13:48
下一篇 2024-08-15 13:12

相关推荐