css框架有哪些

css框架有哪些

Z, ZLW • 2023年1月5日上午4:13 • 科技 • 阅读 1621

css框架有：1、Bootstrap；2、Foundation；3、Bulma；4、Ulkit；5、Semantic UI；6、BlueTrip；7、渴切-开源中文css框架；8、Blueprint。其中，Bootstrap框架被认为是较好的响应式 CSS 框架。

1、Bootstrap

这个框架被认为是较好的响应式 CSS 框架。它专为前端开发而设计，有助于构建网页设计概念、移动优先项目、网格系统、排版、按钮等。Bootstrap 没有任何附加功能，但有可用的第三方插件，除了常规的 HTML 元素之外，Bootstrap 还具有其他常见的 UI 元素。它的核心原则是RWD和移动优先。Bootstrap 版本 3 支持各种浏览器，并且自 Bootstrap 2 以来，该框架已支持响应式网页设计。

Bootstrap非常受欢迎，它可能并不比其他框架好，然而，由于它的受欢迎程度非常高，大多数人都在使用它，并且正因为如此，有很多可用的资源(例如教程、额外的插件等)使使用 Bootstrap 变得更加容易。

2、Foundation

Foundation 是一个开源项目，也是 CSS 框架领域的另一个非常强大的参与者。它以令人难以置信的流畅性和响应性而闻名，可用于多种用途：构建网站、创建电子邮件模板、构建移动和 Web 应用程序。

该框架也非常用户友好，因为它提供培训、支持和咨询。它有一些独特的组件(Keystrokes、Joyride、Flex Video 等)和一些附加组件。它的核心原则，除了 RWD 和移动优先，还包括语义。Foundation以完美的工作流程和对开发人员的大力支持为自己争取了利益。这是一个非常专业的框架，并且有很多可用的教程。

3、Bulma

这个开源和免费的框架在节省时间和精力方面非常棒，并且由于学习和使用非常简单，它获得了相当多的欢迎。Bulma 易于理解且易于使用，同时它具有所有必要的功能，可帮助你创建出色且高效的产品。

首先，Bulma 包含出色的 UI 组件，例如选项卡、导航栏、框、面板等等，因为该框架旨在为你提供清晰而有吸引力的 UI。其次，Bulma 非常模块化，这意味着你可以只导入那些需要的功能，然后就可以开始工作了。最后，这个框架有非常可读的类，这对于一些开发者来说可能是一个巨大的优势。

4、Ulkit

该框架是轻量级和模块化的，用于创建快速但功能强大的 Web 界面。Ulkit 基本上是一个易于定制的组件的集合，它具有 HTML 编辑器、Flex 和其他附加组件和独特的组件。它的核心原则是RWD和移动优先，并且Ulkit被广泛用于很多WordPress主题。该框架为你提供了一种灵活的手动定制机制，并且可以根据你的要求提供真正的帮助。

5、Semantic UI

Semantic UI旨在使网站构建过程更具语义化，它的核心功能是利用自然语言原理，从而使代码更具可读性和易于理解。它的核心原则是标签矛盾、语义和响应性。该框架将单词和类视为可交换的组件，并以直观的 JS 和简单的调试方式脱颖而出。

Semantic UI 的另一个优点是它提供了组织良好的文档和一个包含入门指南的网站。简而言之，它有 3000 多个主题变量、50 多个 UI 组件和 5000 多个提交。绝对值得一试。对于那些想要创建漂亮且响应迅速的网站的人来说，这是一个不错的选择。

6、BlueTrip

BlueTrip 是一个集成了BluePrint & Tripoli 框架的做好的部分；Hartija 的打印样式； 960gs的简洁；Elements 图标的一个css框架。为你提供一个好用的样式集合和一个制作网站的通用的方法。这样你就可以集中精力搞设计了。

7、渴切-开源中文css框架

渴切(Cutter.css)是一个开源中文 (X)HTML/CSS 框架 ,它的目的是减少你的css开发时间。它提供一个可靠的css基础去创建你的项目,能够用于网站的快速设计,通过重设和重建浏览器标准，可以让每个网站防止枯燥的跨浏览器兼容性测试。你可以将他理解成一套模板，里面包含了大多数站点中所需要的那些css类。他很小，只有四个文件而已。总共不到6KB。

8、Blueprint

Blueprint是由于 HTML是一种标准，并且所描述的是结构而非样式，因此 Blueprint 框架是完全作为 CSS 实现的。

在设计网页时要以 Blueprint 为指导，然后再设计或生成 HTML，以便将 Blueprint CSS 样式应用于 HTML 元素。实际上，由于 Blueprint 提供了强大的 CSS，因此可以在 HTML中设计网页，而不必使用图像设计程序来模拟最终页面，比如说 photoshop。从一定意义上说，Blueprint 提供了真正的所见即所得的（WYSIWYG）网页设计，因为原型将使用与最终站点相同的代码。

此外，由于 Blueprint 的主要作用是模拟打印页的外观，因此使用 Blueprint 进行交互式的设计的感觉更像是在使用 QuarkXPress 或 AdobeInDesign。Blueprint 样式基于像素和一个 18 像素的基线网格。借助设计天赋和努力，可以创建具有专业外观的页面。

延伸阅读