android前端开发框架-android 前端开发框架
英文|翻译|Web前端开发(ID:web_qdkf)
对于 UI/UX 设计师来说,制作一个在每个浏览器上看起来都不错的漂亮网站并不是一件容易的事。 在创建网站布局并使其看起来不错时,开发人员必须考虑所有网络浏览器和移动设备视图。
恐惧总是存在的,如果设计在某个愚蠢的浏览器上的某个地方可怕地崩溃了怎么办! 感谢 CSS 框架让开发人员的生活变得无比轻松。 CSS 框架消除了大部分麻烦,如今,开发人员无法想象没有 CSS 框架的编码。 这些框架不仅节省了大量时间,而且有助于以更好更快的方式构建漂亮的响应式 Web 应用程序。 这些框架提供了基本结构,包括网格、交互式 UI 模式、网页排版、工具提示、按钮、表单元素、图标。 提供现成的解决方案,帮助快速建站。 您无需从头开始,您可以在项目中重复使用代码。 现在的问题是,哪种框架最适合您? 如果您是前端开发新手,选择框架可能会有点棘手。 老实说,每个 CSS 框架都有其优点和缺点,因此这取决于您的具体需求。 在本文中,我们将讨论一些适合大多数行业开发人员的流行 CSS 框架。 我们过滤这些框架,牢记它们的优点和缺点。 让我们讨论这些框架。 1. Bootstrap Address:你可能肯定听说过这个框架,即使它是你的第一份工作。 该框架率先提倡“智能手机至上”的理念。 Bootstrap 是世界上最流行的 CSS 框架,它于 2011 年由 Twitter 推出。Bootstrap 对大规模构建响应式设计有很大帮助。 当包含相关的引导程序类时,它会自动调整不同屏幕尺寸的设计。 它提供了大量的插件和主题生成器。 该框架的当前版本是 Bootstrap 4,其中包括一些附加功能,如新配色方案、新修饰符、新实用程序类。 第 4 版是用 SASS 构建的,这意味着 Bootstrap 现在支持 LESS 和 SASS。 优点: 2. Foundation Address:开发人员说,如果编程是一种宗教,那么 Foundation 和 Bootstrap 的人将站在障碍的两边。 Foundation 是世界上另一个使用最广泛的一流 CSS 框架。 许多公司都在使用它,例如 Facebook、eBay、Mozilla、Adobe 甚至迪士尼。 该框架是建立在类似引导程序的 Saas 上的。 它更复杂、更灵活且易于定制。 它也带有一个 CLI,因此很容易与模块捆绑器一起使用。 它提供了 Fastclick.js 工具,用于在移动设备上更快地呈现。
优点: 3. Bulma地址:与其他CSS框架相比,Bulma在市场上是一个比较新的框架,但是Bulma却在短时间内获得了很多用户的关注。 这个免费的开源 CSS 框架基于 Flexbox 布局模型。 最好的是,它完全基于 CSS,根本不需要 javascript。 它被全球超过 200,000 名开发人员使用。 它反应灵敏、轻巧,并遵循“移动优先”的方法。 优点: 4. Pure地址:Pure由Yahoo开发,是一个轻量级的响应式CSS框架。 它是用 Normalize.css 构建的,有助于创建带有网格和菜单的响应式布局。 它可以分为不同的 CSS 模块android前端开发框架,这些模块可以根据您的需要和喜好导入。 所以如果你只需要一个网格系统,你不需要导入整个 CSS 并增加你网站的加载时间。 与 Bootstrap 不同,它不允许创建固定布局。 优点: 5. Semantic UI 地址:这个框架以其令人难以置信的主题效果和简洁优雅的设计而闻名。 语义 UI 是一个使用人性化 HTML 的响应式框架android前端开发框架,它允许您创建一个独特而漂亮的网站,而无需进行多次更改。 它提供了 3000+ 主题变量和 50+ UI 组件。 它还支持React、Meteor、Ember、React等第三方库。 优点: 6. Tailwind CSS 地址:Tailwind CSS是一个灵活的、高度可定制的低级CSS框架。 Tailwind 使用 PostCSS 编写并使用 JavaScript 配置。 您将使用低级实用程序类来自定义设计,而不是预构建的组件,从而让您完全控制网站的最终制作方式。 从正面大小到间距、断点到阴影、颜色到边框大小的一切都可以自定义。 例如,您可以为按钮赋予药丸、轮廓和 3D 外观。 您可以对每个方面进行个性化设置,并以独特的风格创建设计,这种风格绝对不同于 Bootstrap 或 UI 工具包等其他框架。 优点: 7. UIkit 地址:这个强大的CSS框架以其极简的特性着称。 UI Kit 是一个轻量级的极简 CSS 框架,几乎包含了其他框架的所有特性。 您可以使用最大的空白和许多 UI 组件,如 SVG 图标、进度条、图像制作器等来创建超级干净、优雅和漂亮的 Web 界面。 有大量令人难以置信的组件、统一的样式和自定义选项。 您可以使用 Nestable 等组件来创建高级界面。 它使用可靠且无冲突的命名约定。 您还可以使用纯 HTML 设计复杂的基于 flexbox 的布局。
优点: 8. Materialize CSS 地址:如果你喜欢使用 Material Design,那么你一定要看看这个框架。 它由谷歌于 2014 年创建,这个框架对于那些想要设计网站或 Android 网络应用程序的人来说是一个很好的解决方案。 许多谷歌产品都是在这个框架上实现的,例如 YouTube、Gmail、Google Drive 和 Google Docs。 它带有一些现成的组件和类,使您能够以最快的速度完成工作,而不需要太多的努力。 该框架使用基于 12 列网格的布局,该布局使用 Bootstrap、响应式动画和过渡、填充以及灯光和阴影等深度效果构建。 使用其预建的入门模板,您可以用最短的设置时间设计您的网站。
优点: 9. Skeleton地址:顾名思义,Skeleton是最简单、响应最慢的CSS框架。 它仅包含 400 行代码,但提供了多种选项供您在项目中使用。 网格、排版、按钮、表单、列表、媒体查询、表格等功能使您可以轻松创建复杂的网站。 我们已经在 CSS 框架中提到过它,但 Fewer Lines of Code 并没有将自己定义为 CSS 框架、库甚至模块。 它实际上是一个样板,非常适合小型项目或开始其 UI/UX 开发人员职业生涯的人们。 它只附带了有限数量的标准 HTML 元素,但这足以开始一个简单而优雅的网站。 优点: 10. Miligram地址:顾名思义,这是另一个轻量级的CSS框架,旨在更快地创建网站。 框架的大小只有2Kb,但是它有很多功能和web开发工具来满足你的需求。 它为开发人员提供了灵活性,并允许他们使用 CSS3 规范提供的所有功能。 您还可以使用几行自定义 CSS 对其进行扩展。 优点:我们已经提到了一些在开发人员中非常流行的 CSS 框架,但您也可以尝试其他一些框架。 其他一些流行的框架包括 Susy、Animate.css、Paper CSS、NES.css、Base、Tent CSS、Simple Grid、Spectre、Mustard UI、Picnic CSS、Mini.css、Gumby 等。