整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
自己做个网站，不会前端，不会CSS，怎么办？就算会PHP和Java等世界最好的语言，如果不会前端和css，也很难做出漂亮的网站来。
今天，冉雷为大家搜集了几款基于Material Design设计的UI组件库或框架，可以很好的解决上述问题。
Google I/O 2014 发布的 Material Design 渐渐成为统一 Android Mobile、Android Table、Desktop Chrome 等全平台设计语言规范，对从业人员意义重大。
一款基于 Material Design 的现代响应式前端框架。
MUI是一个轻量级的CSS框架，遵循Google的Material Design设计方针。
MDUI 是一套用于开发 Material Design 网页的前端框架。特点如下：
多主题
轻量级
响应式
无依赖
高性能
模块化
本地化
组件丰富
低学习成本
一个基于Google’s Material Design的react组建框架。喜欢Material design，又喜欢用react的，适合折腾这个框架了。
Material Design Lite 不依赖任何js框架，让你轻松将网站样式切换到md设计。
同时基于Foundation UI和material design设计理念的框架。
基于angular框架的material design框架，特点如下：
轻松从0到完成app开发
性能优异
单独为angular优化
基于Bootstrap 4的material design设计框架。
该框架使用了AngularJS和sass开发。
是Material Design的Vue.js 版本。
顾名思义，又一个Material Design的bootstrap版本。
过去的几年里，Web开发已经变得非常流行。每年都会发布许多前端框架，Bootstrap一直是最受欢迎的一个，但是，还有许多其他的框架，你可能没有听说过，但绝对值得一试。想学的同学可以参加Web前端培训，快速有效提升自己。
在本文中，我们将介绍10个好用的框架。
Spectre
Spectre是一个现代的、自由的、响应迅速的CSS框架。它提供了优雅的元素、基于flexbox的响应式布局系统以及CSS组件和实用程序，可以使用Sass和Scss编译器进行修改。它非常轻量级，只有10KB的Gzip，并且支持大多数现代浏览器。
Mustard UI
这是一个开源、轻量级的入门级CSS框架。它分为多个模块，您可以选择是包含所有模块，还是只包含所需的模块。它配备了前端设计所需的所有组件，如flexbox网格、按钮、表格、表单、卡片等，并且可以通过scss变量进行定制。
Bulma
Bulma是一个基于Flexbox布局模型的免费开源现代CSS框架。它提供了一个简单的网格系统、反应灵敏的导航条和多功能的媒体对象。Bulma中的每个元素都是首先移动的，并针对小屏幕进行了优化，并且可以使用修改器类和变量轻松定制。在Web前端培训中，会有很多框架的学习和应用，可以让你快速掌握前端技能。
UI Kit
这是另一个很棒的CSS和JavaScript前端框架，它有自己的SVG图标字体和许多组件。UIkit在外观和框架方面都设计得非常好，具有统一的样式、易于记忆的API、许多自定义选项和有用的修改器类。
TentCSS
TentCSS是一个简单易用的框架，提供了构建响应性网站所需的所有基本组件。它非常轻（仅5kb Gzip），遵循BEM标准，并具有用于布局的现代flexbox网格。
MaterializeCSS
这是一个基于材料设计的现代响应前端框架。它的使用非常简单，特别是对于熟悉其他类似项目（如Bootstrap）的人来说。有一个初学者模板的集合，将帮助您轻松地设计您的网站。
The Zurb Foundation
ZURB基础框架是建立响应网站和应用程序的另一个流行工具。它附带了许多完全可定制的模块化和灵活组件，您可以使用这些组件设计在任何设备上都令人惊叹的漂亮响应网站。通过Web前端培训的学习，理论知识+实践项目，双管齐下，更有利于学员加深对所学知识的理解和运用，真正做到学以致用，从而将知识内化成自身的能力。
Semantic UI
Semantic是一个前端框架，它使用人性化HTML帮助创建美观且响应迅速的布局。它高度可定制，有3000多个CSS变量，可以用于自定义主题。语义高度响应，因为它完全是用“em”值构建的。
Base
Base是一个轻量级的、最小的、响应迅速的CSS框架。它构建在最新的Normalize.css之上，并分为独立的模块，因此您只能使用所需的模块。它首先是移动的，在包括IE10+在内的所有现代浏览器上都非常有效。
MUI
这是一个小型且响应迅速的框架，遵循谷歌的材料设计指南。它没有外部依赖项，并且非常轻量级，只有5.4kb的gzip。它提供React支持，通过SASS文件进行定制，并有一个单独的内联版本用于设置电子邮件样式。
这些框架在web开发工作中也会起到不小的作用，掌握好这些框架的运用将会使你的开发工作变得更加高效和稳定。想要尽快学会这些框架的使用，参加Web前端培训就是一个不错的方法，可以提高学习效率，在最短的时间内学到最多最有效的知识和技能。
了解更多
本例演示：如何使用 <noframes> 标签。
<html> <frameset cols="25%,25%,25%"> <frame src="/example/html/frame_a.html"> <frame src="/example/html/frame_b.html"> <frame src="/example/html/frame_c.html"> <noframes> <body>您的浏览器无法处理框架！</body> </noframes> </frameset> </html>
HTML基础教程：框架实例大合集
本例演示如何制作含有三份文档的框架结构，同时将他们混合置于行和列之中。
<html> <frameset rows="50%,50%"> <frame src="/example/html/frame_a.html"> <frameset cols="25%,75%"> <frame src="/example/html/frame_b.html"> <frame src="/example/html/frame_c.html"> </frameset> </frameset> </html>
HTML基础教程：框架实例大合集
本例演示 noresize 属性。在本例中，框架是不可调整尺寸的。在框架间的边框上拖动鼠标，你会发现边框是无法移动的。
<html> <frameset cols="50%,*,25%"> <frame src="/example/html/frame_a.html" noresize="noresize" /> <frame src="/example/html/frame_b.html" /> <frame src="/example/html/frame_c.html" /> </frameset> </html>
HTML基础教程：框架实例大合集
本例演示如何制作导航框架。导航框架包含一个将第二个框架作为目标的链接列表。名为 "contents.htm" 的文件包含三个链接。
<html> <frameset cols="120,*"> <frame src="/example/html/html_contents.html" > <frame src="/example/html/frame_a.html" name="showframe"> </frameset> </html>
HTML基础教程：框架实例大合集
HTML基础教程：框架实例大合集
HTML基础教程：框架实例大合集
本例演示如何创建内联框架（HTML 页中的框架）。
<html> <body> <iframe wigth="200" height="100" src="/i/eg_landscape.jpg"></iframe> <p>一些老的浏览器不支持 iframe。</p> <p>如果得不到支持，iframe 是不可见的。</p> </body> </html>
HTML基础教程：框架实例大合集
本例演示两个框架。其中的一个框架设置了指向另一个文件内指定的节的链接。这个"link.htm"文件内指定的节使用 <a name="C9"> 进行标识。
<html> <frameset cols="20%,80%"> <frame src="/example/html/frame_a.html"> <frame src="/example/html/link.html#C9"> </frameset> </html>
HTML基础教程：框架实例大合集
本例演示两个框架。左侧的导航框架包含了一个链接列表，这些链接将第二个框架作为目标。第二个框架显示被链接的文档。导航框架其中的链接指向目标文件中指定的节。
<html> <frameset cols="200,*"> <frame src="/example/html/content.html"> <frame src="/example/html/link.html" name="showframe"> </frameset> </html>
HTML基础教程：框架实例大合集
HTML基础教程：框架实例大合集
希望以上可以解决你们心中的一些疑惑，其中可能会有不对的地方或是需要改进的地方，欢迎留言纠正。感觉还不错欢迎关注收藏转载哦
*请认真填写需求信息，我们会在24小时内与您取得联系。
