在您的Web设计中使用12个小型CSS框架

发布时间:2019-08-28 09:58:53 阅读:34

您可能不需要大型UI框架(如Bootstrap)附带的大多数功能,尤其是当您正在处理您希望尽快启动并运行的小型简单项目时。幸运的是,你可以使用更小,更简单的CSS框架

使用小型CSS框架通常可以为开发人员提供更温和的学习曲线,不依赖于JavaScript的功能,以及更快的用户加载时间

我已经创建了一个很好的小/极简主义CSS框架列表供您探索。其中大多数都低于5 KB(当缩小和压缩时)并且包含用于构建响应式网页设计的基本成分。

分

min,这个列表中最小的CSS框架,具有响应式12列网格系统,按钮样式,表格样式,Android兼容图标等。min甚至支持像Internet Explorer 5.5这样的古老浏览器。

毫克

毫克

Milligram用于现代UI - 它的网格系统使用FlexBox,尺寸和长度使用rem单位,它是Mobile First。处于最前沿需要付出代价:Milligram仅正式支持最新版本的Chrome,Firefox,IE,Safari和Opera。

Blaze CSS

Blaze CSS

开箱即用,Blaze CSS已经是轻量级的,但由于其模块化架构允许您只包含您打算在项目中使用的部分,因此您可以进一步减小文件大小。(阅读有关创建自定义Blaze CSS构建的说明以获取更多信息。)

KUBE

KUBE

Kube为重量小于6 KB的CSS框架打包。它具有响应式网格系统,用于样式化Web表单的强大类集,多个表类,用于向用户显示重要消息的通知类等。

纯

Pure,一个由雅虎领导的开源项目!开发人员,是一套CSS模块,可以帮助您快速构建响应式Web设计。Pure具有适用于所有HTML元素的基本样式(在Normalize.css之上开发),以及用于网格布局,Web表单,按钮,表格和导航菜单的模块

鬼鬼祟祟

鬼鬼祟祟

Furtive称自己为“CSS微框架”,面向现代网页设计。与Milligram一样,Furtive是Mobile First,具有基于FlexBox的响应式网格,并使用该rem单元的长度和大小。它涵盖了基础知识:按钮,表单,甚至默认颜色类。

骨架

骨架

虽然它在一年多的时间里没有更新,但Skeleton 仍然是快速构建现代响应式网页设计的一流起点/样板。它为您的HTML元素提供了直观的网格系统和基本样式。

福克斯CSS

福克斯CSS

FOX CSS是一个轻量级的模块化CSS框架。它使用Mobile First设计方法,支持与IE 9一样古老的浏览器,并具有非侵略性CSS重置(受KNACSS启发)。

Basscss

Basscss

Basscss由22个CSS模块组成,包括CSS重置,网格系统,颜色类,实用程序类,以帮助您构建响应式设计等等。对于重量不到4 KB的东西,Basscss的功能非常丰富。

Siimple

Siimple

Siimple是一个极简主义的CSS框架,用于构建响应迅速,干净的Web设计。它类似于Skeleton:它有一个直观的12列网格系统和基本样式,用于排版,表格,按钮,表格等。

莲花

莲花

Lotus是最小的CSS框架之一。它涵盖了必需品:响应式网格系统,排版,按钮和Web表单。

野餐CSS

野餐CSS

Picnic CSS是一个用Sass编写的轻量级UI框架,使您可以更轻松地编辑和自定义颜色和长度等变量。它还有一些令人印象深刻的纯CSS UI组件,如模态窗口和内容滑块。

汇总表

下表包含有关此列表中的CSS框架的有用详细信息。

名称 尺寸* 文件 执照 GitHub回购 人气**
1.02 KB 文件 MIT 回购 685
毫克 4.05 KB 文件 MIT 回购 3000
BlazeCSS 5.71 KB 文件 MIT 回购 7
KUBE 5.94 KB 文件 MIT 回购(过时) 538
4.0 KB 文件 BSD 回购 13373
鬼鬼祟祟 2.37 KB 文件 MIT 回购 369
骨架 1.57 KB 文件 MIT 回购 10884
福克斯CSS 2.46 KB 文件 未知 回购 87
Basscss 3.49 KB 文件 MIT 回购 2597
Siimple 5.56 KB 文件 MIT 回购 14
莲花 1.80 KB 文件 MIT 回购 14
野餐CSS 2.32 KB 文件 MIT 回购 932

* Size缩小和gzip压缩CSS文件的文件大小大小值来自我对每个CSS框架的生产就绪/分发样式表的独立测试。

**受欢迎程度是指在GitHub上跟踪CSS框架源代码的用户数量。此值通过项目在发布此帖子时所具有数来衡量更高的价值意味着该项目更受欢迎。


我们在微信上24小时期待你的声音
解答:网站优化,网站建设,搜索引擎优化,APP 开发,小程序开发

非常感谢您有耐心的读完这篇文章:"在您的Web设计中使用12个小型CSS框架",此文章仅为提供更多信息供用户参考使用或为学习交流的方便。如果对您有帮助,请收藏我们的网址:https://www.91webs.cn


18617670560