2017 年 20 个最佳的极简 CSS 框架

最新推荐文章于 2024-09-15 07:45:37 发布
最新推荐文章于 2024-09-15 07:45:37 发布
阅读量379 收藏 2
点赞数
分类专栏： HTML/CSS

2017 年 20 个最佳的极简 CSS 框架

2017/07/10 · CSS · 框架

原文出处： HENRI WIJAYA   译文出处：IT程序狮   

无论是在产品设计，还是在研发上，极简主义的应用简直无处不在。如果你和我一样热衷极简主义，那么本文分享的内容，一定是你的“菜”。在文章中，我们将与大家分享 20 个最佳的极简 CSS 框架，它们能够为你提供建站必备的组件，帮助你节省时间。Have Fun!

1. Spectre

这是一个轻量级、响应式的现代 CSS 框架，用于快速建站和扩展程序的开发。它通过最佳编码实践和一致性的设计语言，为排版与元素、基于 Flexbox 的响应布局系统、CSS 组件提供了基本样式。

项目地址：【传送门】

2. Layers

Layers CSS是一个针对实例的 CSS 框架。它具备轻量级、零依赖等特性。

项目地址：【传送门】

3. Milligram

Milligram 提供了极简样式设置，便于你快速、简洁的开启建站之旅。虽然它不是一个 UI 框架，但它的设计理念却是以提供优秀的性能、高效的开发效率以及最少的属性重置而构建的。同时，它也是轻量的，在 Gzip 压缩后，它只有 2KB 大小。

项目地址：【传送门】

4. Cutestrap

如果你在寻找功能丰富的组件，那么 Bootstrap、Foundation 这类框架将会是你的最佳选择。但是，如果你想选择的框架大小是在 normalize.css 与一个完整框架范围之间， Cutestrap 或许是个不错的选择。它在压缩后仅有 8K 大小，可作为 Bootstrap 的轻量级替代方案。

项目地址：【传送门】

5. Mobi

Mobi.css 是一个轻量级、可扩展、移动优先的 CSS 框架。它专注于细节，对于内容丰富的网页能够提供优质的用户体验。虽然，它专注移动端，但桌面客户端的体验也是很棒的。

项目地址：【传送门】

6. Hack

Hack 是一个极度简易的 CSS 框架。这有一些示例，你可以了解下。

项目地址：【传送门】

7. Wing

一个基于极简主义设计理念的漂亮的 CSS 框架。

项目地址：【传送门】

8. Sakura

一个易于定制的极简 CSS 框架/主题。

项目地址：【传送门】

9. Mini

Mini 作为一个 Gzip 压缩后不到 7KB 大小的极简框架，它具备响应式、易用性和定制性等特性，旨在为你提供尽可能多的功能。由于它是轻量框架，不仅让你创建的网站和应用程序具备更快的加载速度，而且它所提供的组件可以满足基本的开发要求。

项目地址：【传送门】

10. Pavilion

Pavilion 是一个简易的 CSS 框架，适合那些不喜欢使用其他框架中附带预定义 UI 组件的开发人员。如果你正在寻找一个简单、轻量、可订制的，并且不会出现代码膨胀的 CSS 框架，Pavilion 将是个不错的选择。

项目地址：【传送门】

11. Core CSS

这是一个构建轻量级响应式网站的前端框架，它没有内置预设元素和动画，只提供了一个超简单的网格体系 – 即它的列是浮动的，行是 self-clearing，而分界点则是按逻辑均匀的分布。你可以按照想要的工作方式，进行定制与使用。

项目地址：【传送门】

12. Siimple

Siimple 是一个助你打造扁平化网站风格的轻量、响应式的开源框架。它内置了 SASS / SCSS，为你的网页设计提供了简洁的开始。

项目地址：【传送门】

13. Scooter

专注为 Dropbox 提供基础样式、CSS 组件以及快速静态原型的 SCSS 框架。

项目地址：【传送门】

14. Workless

打造更快 Web 应用程序的开源 HTML, CSS 与 JS 框架。

项目地址：【传送门】

15. Responsive

一个功能强大、对开发人员友好的，用于构建响应式网站的轻量级前端框架。

项目地址：【传送门】

16. Kouto swiss

专注于 Stylus 的完整 CSS 框架。它的灵感源自流行的预处理工具库，例如 nib、compass、bourbon.

项目地址：【传送门】

17. Concise

Concise 为你的网站设计提供了坚实的基础。它提供了一套仅包含基础样式的简洁框架，并包含了大量开箱即用的功能。同时，你也可以通过使用内核的附加组件进行功能性扩展。

项目地址：【传送门】

18. Penguin

Penguin 是一个由 Sass 构建的轻量级、可扩展的前端框架，用于启动任何项目。

项目地址：【传送门】

19. Base

一个稳固的响应式 HTML 与 CSS 框架。

项目地址：【传送门】

20. Caramel

Caramel 是一个简单、现代的完全响应式 Web 框架。你仅需要编写一次代码，即可获得在多平台上相同的效果。

行云墨客
关注
专栏目录
2023 年 React 的 23 个最佳 CSS 框架
我的博客，不一样的自我表达
06-08 553
React Material Components - Material Design CSS 框架的基于 React 的实现，它提供预构建的组件和样式以创建现代和响应式用户界面。React Bootstrap - Bootstrap CSS 框架的基于 React 的实现，它提供预构建的组件和样式，用于创建响应式和移动友好的用户界面。基于 React 的 CSS 框架和组件库是专门为 React 应用程序设计的，它们提供了预构建的 UI 组件和样式，可以轻松集成到 React 项目中。
面试题整理｜45个CSS面试题
热门推荐
pengxian00007的博客
05-12 3万+
面试题整理｜45个CSS面试题一、初级CSS面试题二、中级CSS面试题三、进阶CSS面试题四《HTML5&CSS3还原美团外卖》移动端布局实战 CSS已成为Web设计不可或缺的一部分，它让web页面变得更加美观，更具设计感。在前端面试中，CSS面试题也占有一定比重。 本篇文章，将为大家分享45个和CSS相关的面试题及其解析，难度分为：初级、中级、高级三个部分，由易到难，循序渐进。 一、初级CSS面试题 Q1、CSS全称是什么？ CSS英文全称：Cascading Style Sheets，也就是层
oh-my-css:专为极简主义者设计的纯CSS框架
05-17
哦，我CSS Oh-My-CSS是专为极简主义者设计的纯CSS框架。 我正在为此而努力，但进展缓慢。 首先阅读 该项目用于我的手写笔和翡翠学习。 文献资料 执照
CSS Framework，让你事半功倍
IT民工的坐井观天
04-19 653
http://www.1x3x.net/blog/web-design/2008/04/css-framework.html近两年来，程序员有一句话很流行，“不要重复制造轮子”，所以出现了许许多多让我们非常受用的各种框架。Framework在开发的各个领域给我们减少了很多工作量。而对于网页设计师来说，一直以来，缺少这样的Framework来帮助设计师们减轻工作量。 今天给大家推荐一些不错的
lit：极简响应式CSS框架，轻巧且强大！
gitblog_00076的博客
05-12 528
lit：极简响应式CSS框架，轻巧且强大！ litWorld's smallest responsive ???? css framework (395 bytes) 项目地址:https://gitcode.com/gh_mirrors/lit1/lit 项目介绍 lit 是一个令人惊讶的微小响应式CSS框架，它在保持功能完整性的同时，挑战了代码最小化的极限。与Skeleton和Milligram等...
JAVA-Blog:极简无框架JAVA博客，功能完备，使用servlet(jsp)+ajax+mysql模拟MVC模式，javaEE初学者最佳实践
05-03
一个功能齐全的博客。 包括文章，点赞，评论，登陆注册，排行。 版本 0.2version 已经对前端页面进行了重构，新添响应式js，动画css，新版见 0.1version 没有使用框架，以后可能会重构 主要使用了： JSP-SERVLET-...
极简文艺风格CSS模板下载与响应式网页源码解析
资源摘要信息:"本资源是一套极简文艺风格的CSS模板，编号为4623，它...通过以上知识点，开发者可以更深入地理解极简文艺风格CSS模板的用途和功能，并有效地使用这些资源构建符合移动端访问习惯和审美需求的现代网站。
分享一个简单容易上手的CSS框架：Pure.Css
前端达人
10-17 684
雅虎（Yahoo!）创建了一个简单的CSS框架，被称为Pure.css（https://purecss.io/），以提供一套基础样式集，可作为网页开发的起点。Pure.css旨在轻量、模块化和响应式，使构建快速加载、适用于任何设备的移动友好网站变得简单。在本文中，我们将讨论Pure.css的工作原理以及如何使用它。为了使默认样式在多个浏览器中保持一致，我们使用Normalize.css来构建Pur...
lacus:一个简单的css框架
06-19
##Lacus ###简介 Lacus是动漫高达seed的女主角，是一套用less编写的适用于PC端的前端样式库，同时也是使用CSS库。 ###目标 尝试打造一套编写完善，在IE渲染时不会被破坏（或只有一些小问题）的样式库，同时又保持CSS的高效性和可维护性。 注：不完美支持ie8以下及更低版本 ###结构 #####基础框架 reset function font layout variable mixin #####通用样式 elements box button checkbox dropdown image icon list tip texttip collections breadcrumb form nav pagination tab table modules album bobble calendar dialog dropdown poplayer select si
Milligram极简风格的CSS框架
08-08
Milligram提供了一个简单的样式设置，以便快速，干净的开始。 只是它！ 只有2kb gzipped！ 这不是一个UI框架。 专门设计的更好的性能和更高的生产力，更少的属性重置，导致更干净的代码。
html css极简网页架构
12-25
HTML、css网站模板，内含字体文件
好用的CSS框架，真的很好用
06-03
很好用的CSS，960 Grid System Version 1.5 2010-05-11 Created by Nathan Smith. See the official site for more info: http://960.gs/ ============================================================================ Thank you for downloading the 960 Grid System. I hope it helps to streamline web development workflow. Enclosed in the bundle are printable sketch sheets and template files for Adobe Fireworks and Photoshop, OmniGraffle and Visio. Also included is a lightweight CSS file, which contains the grid dimensions. To use this file, simply include the 960.css in the <head> of the HTML page. You may also use the reset.css and text.css files, or opt to leave them out. Here is an example of the XHTML code necessary to incorporate the CSS files: <head> <link rel="stylesheet" type="text/css" media="all" href="css/reset.css" /> <link rel="stylesheet" type="text/css" media="all" href="css/text.css" /> <link rel="stylesheet" type="text/css" media="all" href="css/960.css" /> </head> It is worth noting that these styles do not automatically make up a finished site design. They are simply a starting point, ideally for rapid prototyping or as a basis for creating your own designs. You should not feel constrained by the way I have built the initial code. If you disagree with how something has been done, feel free to revise it for the needs of your particular site. The files in the 960 Grid System are free of charge, licensed under GPL/MIT. ============================================================================ Note that if you are building a site in a language which reads from right to left, use the CSS files that begin with "rtl_" instead. Denote the language: <html lang="..." dir="rtl"> Be sure to replace "..." with the appropriate two-letter abbreviation of the language you are using. Example: lang="he" for Hebrew, lang="ar" for Arabic. ============================================================================ Special thanks to Eric Meyer for his comprehensive browser reset stylesheet. http://meyerweb.com/eric/tools/css/reset/
通用网站框架（div+css）适合新手
04-19
通用网站框架（div+css）带注释，结构清晰明了。 适合新手使用。
Snack：极简主义的CSS框架，让你的前端开发更高效
最新发布
gitblog_00348的博客
09-15 577
Snack：极简主义的CSS框架，让你的前端开发更高效 snack ???? A minimal CSS framework for web. 项目地址: https://gitcode.com/gh_mirrors/snac/snac...
html css 极简模板,Mini.css - 又一个极简 CSS 框架
weixin_35437233的博客
06-22 538
A minimal, responsive, style-agnostic CSS framework mini.css is a lightweight CSS framework (under 7KB gzipped) designed with mobile devi...
认识Cutestrap，一个轻量级CSS框架
culi3118的博客
08-16 274
轻量级 css框架Cutestrap is a brand new CSS framework. This article presents Cutestrap’s features and puts the framework to the test by using it to build a simple one-page HTML template. Cutestrap是一个全新CSS框...
PicoCSS: 极简主义的未来式前端框架
gitblog_00069的博客
03-19 601
PicoCSS: 极简主义的未来式前端框架 去发现同类优质开源项目:https://gitcode.com/ 是一个轻量级、高效的CSS框架，旨在提供一种简约的方式来构建响应式的网页设计，同时保持代码的清晰和可维护性。它的核心理念是“做最少的事，获得最大的效果”，这种设计理念使得PicoCSS成为对性能敏感的开发者或喜欢简洁代码的设计师的理想选择。 技术分析 轻量化: PicoCSS的核心库小...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值