响应式网页设计的十大开发框架_百度知道
响应式网页设计的十大开发框架
我有更好的答案
Gumby FrameworkGumby 2是建立在Sass基础上的。Sass是一款非常强大的CSS 预处理器，允许用户自主快速的开发扩展Gumby，同时提供很多新的工具来自定义和扩展Gumby框架。Gumby 2是一个非常棒的响应式CSS框架。Get UI KitGet UI Kit是一款轻量级、模块化的前端框架，可快速构建强大的web前端界面，而且，它是一款开源的前端UI界面的框架，可以无任何限制的使用UIKit 来创建自己的风格。FoundationFoundation是一个易用、强大而且灵活的框架，用于构建基于任何设备上的Web应用。提供多种Web上的UI 组件，如表单、按钮、 标签等。SemanticUI是Web的灵魂！Semantic是为工程师而制作的可复用的开源前端框架。提供各种UI组件，使得开发更加直观、易于理解。52Framework52 Framework主要用于优化HTML5和CSS3的跨浏览器兼容性的框架，可在所有主流浏览器上运行。PureCSSPure是一组小的、响应式CSS模块，可用于任意Web项目中。它可作为每个网站或Web应用的起步工具，帮助开发者处理应用程序所需的所有CSS工作，同时不会让每个应用千篇一律。ResponsablecssResponsable使用最少的Sass，带给你最完美的响应式框架。TukTukTukTuk支持代码重用功能，提供更加快速、高效的样式列表，易于添加与维护。KubeKube是全球最为流行、最灵活的CSS框架之一。其带给你最强大的功能选择，极具创意性与美观性。IvoryIvory是一款强大、灵活、易用的响应式框架。 Ivory基于12列的响应式网格布局，包含表格，按钮，表格，分页，拨动开关，工具提示，手风琴，选项卡等网站中常用的组件和样式。
其他类似问题
为您推荐：
您可能关注的推广
网页设计的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁　　　　Amaze UI 跨屏前端技术为什这么火？　　Amaze UI 的优势　　过去IT趋势都是由IBM、甲骨文、微软等IT巨头推出新产品，带出产业的革新，但是现在谈到云端、谈到移动互联网，基本上都是开源软件引领市场，如美国 的Amazon、Google、Facebook等，中国的BAT(百度、阿里巴巴、腾讯)等等都相继推出了自己的开源产品。　　Amaze UI应该是中国首个HTML5跨屏前端开发框架，其不仅兼容前几者的优势，还具有以下优势：　　1． 加入更多符合中国市场特性的元素：中文排版更优化，兼容中国本土主流浏览器　　2． 更轻量化，不仅适用于桌面端，更适合移动端　　3． 包含一些封装好的Widgets，其他框架则没有　　3个月10万的下载量是如何炼成的?　　Amaze UI，一个还不错的开源HTML5跨屏前端框架。也许是因为HTML5终于在今年下半年定稿了，基于HTML5的开发再度升温，使得仅仅上线4个月的 Amaze UI在Github上就获得了超过2000的星标注，跻身国产开源软件排行榜Top5，与BAT齐名。　　最近，Amaze UI的下载量已经超过10万了，对于一个由创业团队推出，且上线时间仅仅只有几个月的开源框架来说，确实不容易。对于这些成绩，Amaze UI的项目负责人云适配CEO陈本峰解释说，这些得益于HTML5的“东风”，除此之外，更是因为Amaze UI是最懂中国程序猿的开　　源 HTML5 跨屏前端框架。　　为什么说是借了HTML5的“东风”呢?　　HTML5是唯一一个通吃PC、Mac、iPhone、iPad、Android、Windows Phone等主流平台的跨平台语言。在HTML5定稿之前，国内绝大多数浏览器已经支持HTML5，包括UC在内的很多手机浏览器已经迫不及待发展Web App，用于抵消原生App所吞噬的流量。　　而随着今年HTML5的定稿的当下，已经是移动互联网的天下，对于移动设备来说，硬件性能的提升移动程度上抹平了HTML的不足，同时补充了流媒体和游戏 能力。行业支持上从最新的Android5.0开始，Webview可以通过Google Play Store实时更新，和Chrome的升级保持一致，用户就可以不刷机享受到最新的浏览器引擎;iOS 8发布后，苹果还是很识趣地取消了三方程序调用Nitro的限制，现在任意浏览器或应用调用iOS的UIWebview都可以利用Nitro加速。　　随着硬件性能的持续提升，开发者们的持续努力，这一切都让HTML5迅速升温，这让Amaze UI“恰逢大势”。　　除此之外，Amaze UI虽然是一个开源框架，但是它还有一个专门的团队每天维护。对于这一点，陈本峰介绍说，从国外的开源经验来看，一个项目要想成功，必须有一个专职的研发 团队来做。虽然我们谈开源，经常说靠社区的力量，但是最核心的推动力还需要是专职团队，并且这个专职团队是真的为社区服务的，“Amaze UI就拥有这样一支团队”　　前端框架这么多，Amaze UI为什么会火?　　国内前端框架确实不少，但能解决浏览器存在的跨屏适配和兼容性问题的技术却很少。再加上国内对开源技术的思想意识不够，很多成熟的技术主要封闭在自己的公司内，这样造成整个产业链在技术上很难互惠互通。　　与此同时，移动、跨屏已经成为了的当下互联网最热门的技术，而前端开发者在开发网页时，时常会陷入重复解决繁复的跨屏、适配问题，耗费精力，影响工作效率，产品开发进度慢这样的恶性循环中。　　Amaze UI 以“移动优先(Mobile first)”为理念，从小屏逐步扩展到大屏，最终实现所有屏幕适配，适应移动互联潮流。而且针对移动平台做了性能和体积方面的优化，大幅度提升用户体验。　　目前与Amaze UI功能相似的能解决同类需求的主要是国外的开源框架，如Bootstrap、Foundation、Semantic UI。　　全球有将近6%的网站是基于Bootstrap做的。不过对于中国开发者来说，Bootstrap门槛仍然较高，而且本土化支持不够好。首 先，Bootstrap只支持英文字体，并没有对中文字体做设置。在不同操作系统、不同浏览器下，默认的中文字体可能是不一样的，这样会导致网页在某些时 候显示得不太好看;其次，国内浏览器种类繁多，Bootstrap也无法照顾到对国内浏览器的支持；再次，Bootstrap因为最早是从PC端开始做 的，所以有些地方是先PC后移动，而Amaze UI的思路是先移动后PC。　　如今，“浏览器”这个概念在移动时代已经完全不同了。陈本 峰认为，微信、百度App、微博都是"浏览器"，因为这些超级App都紧密融合了HTML5的运行环境，比如微信朋友圈的内容就是HTML5的。用户在超 级App上浏览网页的频率甚至要高于独立的浏览器，所以今天的"移动浏览器"应该包括微信、百度、微博等超级App。　　Amaze UI何以能PK国外知名开源框架？　　如果要说起目前与Amaze UI功能相似能解决同类需求的主要是国外的开源框架，如Bootstrap、Foundation、Semantic UI。　　Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架，集合CSS和HTML，使用了最新的浏览器技术，为快速WEB开发提供了一套前端工具包。　　Foundation宣称是世界最好的响应式前端框架，默认支持5种网格布局，是三款框架中最复杂也是最灵活的。Bootstrap默认支持四种网格布局，Pure默认支持一种。　　Semantic UI是语义化设计的前端框架，开发更加直观，UI组建可实时调试输出，其最大的特点是充分利用CSS3动画特效，简洁实用漂亮的样式。　　不过对于中国的开发者们来说，Amaze UI的出现在中文字体支持、浏览器兼容以及更好地跨屏兼容到移动端等问题上，有着更加突出的优势。　　其一，云适配封装了更多组件，包含近 20 个 CSS 组件、10 个 JS 组件，更有 17 款包含近 60 个主题的 Web 组件，可快速构建界面出色、体验优秀的跨屏页面。　　其二，相比国外的前端框架，Amaze UI 加入了更多本土化元素，专注解决中文排版优化问题。　　其三，针对国内主流浏览器及 App 内置浏览器提供更好的兼容性支持，为开发者节省大量兼容性调试时间。　　其四，Amaze UI 非常注重性能，基于轻量的jQuery开发，并使用 CSS3 来做动画交互，平滑、高效，更适合移动设备，让 Web 应用可以高速载入。　　Amaze UI真能革国内移动跨屏前端技术的命？　　对于云适配来说，从创立之初，内部团队成员就希望把这个产品开源，分享给更多的人，与广大优秀前端开发者共同完善Amaze UI 的功能，推动中国移动跨屏前端技术的发展。　　而从前端开发效率、网页效果等方面来看，Amaze UI跻身成为国内领先水平，并深受国内广大中小站长的欢迎。与此同时，Amaze UI已经为计蒜客、蹭课助手等网站制作了风格酷炫，调性凸显的跨屏网站，并且登上了开源中国、SegmentFault 、CSDN、Gitcafe、前端乱炖等各大开发者社区头条。　　不可否认，在中国的移动跨屏前端技术领域，Amaze UI是一颗冉冉升起并且为数不多的新星，未来将逐渐走向国内该技术领域的领导者，在该领域掀起一场变革。　　更多最新web前端技术关注Web前端开发网！
楼主发言：1次 发图：0张
请遵守言论规则，不得违反国家法律法规Semantic友好的HTML的开发框架，能帮你制作美观、支持自适应布局的网站。
50+ UI元素
3000 + CSS 变量
3层变量继承（和SublimeText相同）
自适应设计，支持EM单位
使用友好的Flexbox布局
简约纯净的 HTML
Semantic UI把词语和类看成一个个可以任意组合的概念
使用如：名词/修饰语，文字序列以及诸多的自然语法来定义类名（class）
获取与使用 或者
一般的体验，但是Semantic去除了使用它们时的各种繁琐。
直观明了的 Javascript
Semantic 使用被叫做 behaviors 的简单短语来触发功能。
开发者可以更改任何组件中的配置来设置该组件中的某一设置。
化繁为简的调试
记录日志使您很方便的追踪到性能瓶颈，而不必去堆栈轨迹中发掘问题所在。
主题好用到难以置信
Semantic 自带简约的可继承系统，以及高级主题变量，使您可以自由的完成各式各样的设计
只需开发一次UI，您就可以在各处部署相同的代码。
支持响应式设计
Semantic是完全为em标签设计使响应式标准成为轻而易举的事。设计变量作为元素允许你选择如何使内容更好地适应平板和移动设备。
你喜欢的伙伴和资料库
Semantic 集成了 React、Angular、Meteor 以及很多其他框架以帮助你组织 UI 层和你的应用逻辑层。
安装 NodeJS
如果你对设置NodeJS还不太熟悉，你可以先照着下列步骤做，或者查看
可选方式 1: Homebrew
后直接安装
brew install node
brew install node
可选方式 2: Git
git clone git:///ry/node.git
./configure
sudo make install
git clone git://github.com/ry/node.gitcd node./configuremakesudo make install
Semantic UI 支持通过
运行命令行工具，可用于编写你所需要的部件库。
Gulp 是个 NPM 模块，必须进行全局安装。
npm install -g gulp
npm install -g gulp
安装 Semantic UI
Semantic UI 可以通过运行NPM中同名安装包来获取
npm install semantic-ui --save
cd semantic/
gulp build
npm install semantic-ui --savecd semantic/gulp build
加入到您的HTML中
运行gulp搭建工具，您只需要在HTML中把您项目中的CSS和JS链接进去，它将进行自动编译。
&link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css"&
&script src="semantic/dist/semantic.min.js"&&/script&
&link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css"&&script src="semantic/dist/semantic.min.js"&&/script&
通过NPM升级
只要您的站点和主题还在保持使用，NPM 脚本即可自动更新Semantic UI至最新版本。
npm update
npm update
打赏支持编辑整理更多优质资源，谢谢！
打赏支持编辑整理更多优质资源，谢谢！
任选一种支付方式
资源整理者简介：
可能感兴趣的文章
按分类快速查找
关于资源导航
伯乐在线资源导航收录优秀的工具资源。内容覆盖开发、设计、产品和管理等IT互联网行业相关的领域。目前已经收录 1281 项工具资源。
关于资源导航
伯乐在线资源导航收录优秀的工具资源。内容覆盖开发、设计、产品和管理等IT互联网行业相关的领域。
新浪微博：
推荐微信号
（加好友请注明来意）
- 好的话题、有启发的回复、值得信赖的圈子
- 分享和发现有价值的内容与观点
- 为IT单身男女服务的征婚传播平台
- 优秀的工具资源导航
- 翻译传播优秀的外文文章
- 国内外的精选博客文章
- UI,网页，交互和用户体验
- 专注iOS技术分享
- 专注Android技术分享
- JavaScript, HTML5, CSS
- 专注Java技术分享
- 专注Python技术分享
& 2016 伯乐在线Semantic UI
中文 (臺灣)
Chinese (Taiwan)
ελληνικ?
Русский
Nederlands
Português(BR)
Portuguese
Indonesian
Indonesian
Lithuanian
ti?ng Vi?t
Vietnamese
Semantic is a development framework that helps create beautiful, responsive layouts using human-friendly HTML.
Semantic UI treats words and classes as exchangeable concepts.
Classes use syntax from natural languages like noun/modifier relationships, word order, and plurality to link concepts intuitively.
Get the same benefits as
or , but without the tedium.
Semantic uses simple phrases called behaviors that trigger functionality.
Any arbitrary decision in a component is included as a setting that developers can modify.
$('select.dropdown')
.dropdown('set selected', ['meteor', 'ember'])
Javascript
Javascript
Performance logging lets you track down bottlenecks without digging through stack traces.
$('.sequenced.images .image')
.transition({
animation : 'jiggle',
Semantic comes equipped with an intuitive inheritance system and high level theming variables that let you have complete design freedom.
Develop your UI once, then deploy with the same code everywhere.
Select Theme
Semantic UI
Google Material
Add to Cart
Save for Later
The only dogma from this framework: everything arbitrary is mutable.
Build your entire site with one UI stack. Share your UI between multiple projects.
Semantic UI is a free open source project already used in multiple
environments.
Definitions aren't limited to just buttons on a page. Semantic's components allow several distinct types of definitions: elements, collections, views, modules and behaviors which cover the gamut of interface design.
This site uses cookies
It will be ready in just a second.
Add Friend
added you as a friend
You added Lena to the group Close Friends
Eve just posted on your page
United Arab Emirates
Afghanistan
Netherlands Antilles
American Samoa
Aland Islands
Azerbaijan
Bangladesh
Burkina Faso
Bouvet Island
Cocos Islands
Central African Republic
Congo Brazzaville
Switzerland
Cote Divoire
Cook Islands
Costa Rica
Cape Verde
Christmas Island
Czech Republic
Dominican Republic
Western Sahara
European Union
Falkland Islands
Micronesia
Faroe Islands
French Guiana
Guadeloupe
Equatorial Guinea
Sandwich Islands
Guinea-Bissau
Heard Island
Indian Ocean Territory
Kyrgyzstan
Saint Kitts and Nevis
North Korea
South Korea
Cayman Islands
Kazakhstan
Saint Lucia
Liechtenstein
Luxembourg
Montenegro
Madagascar
Marshall Islands
Northern Mariana Islands
Martinique
Mauritania
Montserrat
Mozambique
New Caledonia
Norfolk Island
Netherlands
New Zealand
French Polynesia
New Guinea
Philippines
Saint Pierre
Pitcairn Islands
Puerto Rico
Saudi Arabia
Solomon Islands
Seychelles
Saint Helena
Svalbard, I Flag Jan Mayen
Sierra Leone
San Marino
El Salvador
Caicos Islands
French Territories
Tajikistan
Timorleste
Turkmenistan
Us Minor Islands
United States
Uzbekistan
Vatican City
Saint Vincent
British Virgin Islands
Us Virgin Islands
Wallis and Futuna
South Africa
Filter Posts
Announcement
Cannot Fix
Enhancement
Change Declined
Interesting
Discussion
I enjoy having fun
Receive weekly poodle newsletter
Make my dog's profile public
Semantic is designed completely with em making responsive sizing a breeze. Design variations built into elements allow you to make the choice how content adjusts for tablet and mobile.
Semantic has integrations with React, Angular, Meteor, Ember and many other frameworks to help organize your UI layer alongside your application logic.
Build tools, performance logging, support for custom definitions, multiple-levels of theme inheritance—a developer's dream.
Support for the continued development of Semantic UI comes directly from the community.
Donate Today
This translation is only % complete!
We need your help to make Semantic available to
people who speak your language.
Our translation tools are easy to use and allow you to translate text without having to leave the site.
Semantic is available at
a mirror site hosted inside China. This should make browsing much faster for those visiting from mainland China.Semantic UI首页、文档和下载 - 前端界面开发框架 - 开源中国社区
当前访客身份：游客 [
当前位置：
Semantic UI
Semantic UI—完全语义化的前端界面开发框架，跟
比起来，还是有些不同的，在功能特性上、布局设计上、用户体验上均存在很多差异。Semantic UI 特点： 文档和演示非常完善易于学习和使用配备网格布局支持
动态样式语言有一些非常实用的附加配置，例如inverted类。对于社区贡献来说是比较开放的。有一个非常好的按钮实现，情态动词，和进度条。在许多功能上使用图标字体。Semantic UI 对浏览器的支持：Last 2 Versions FF, Chrome, IE (aka 10+)Safari 6IE 9+ (Browser prefix only)Android 4Blackberry 10
Semantic UI最新更新资讯，共67条&&(，)
2评/2221阅
10评/2555阅
8评/1510阅
14评/2725阅
19评/3224阅
授权协议：
开发语言：
操作系统：跨平台&
收录时间：
如此人生 发表于9个月前
imooncat 发表于11个月前
月牙儿-sky 发表于1年前
，最后回答(11个月前)：
Tinker404 发表于1年前
，最后回答(11个月前)：
叫我爷_好吗 发表于3年前
，最后回答(1年前)：
limaofeng 发表于1年前
，最后回答(1年前)：
云适配 发表于2年前
，最后回答(1年前)：
Brox 发表于2年前
，最后回答(2年前)：
伊藤熊吉 发表于2年前
，最后回答(2年前)：
使用 Semantic UI 中的任何问题
：挺小清新的，感觉
的表单提交方式中。。。
：版本帝好久没有发威了
：osc几大诡异事件：
哥找到了男票； 两周没发版本；红薯的头发茂密如林；小编辑的节操爆表…欢迎补充
：百度娘的
关键字搜素，官网都不在首页，吃屎的搜索引擎。
共有 235 个类似软件
Bootstrap是快速开发Web应用程序的前端工具包。它是一个CSS和HTML的集合，它使用了...
Flat UI是一套精美的扁平风格 UI 工具包，基于 Twitter Bootstrap 实现。这套界面...
zui框架是什么？ zui是禅道项目管理软件团队在完善自己产品过程中形成的一个开源前...
Less CSS 是一个使用广泛的 CSS 预处理器，通过简单的语法和变量对 CSS 进行扩展，...
BootMetro 基于 Twitter Bootstrap 框架构建，用于创建 Windows 8 的 Metro 风格的...
Elastic 是一个简单的 CSS 框架用来对网页进行布局。Elastic 可实现各种各样常见的...
Pure 是来自雅虎的 CSS 框架，使用 Normalize.CSS 无需任何 JavaScript 代码。框架...
bootswatch是一款基于bootstrap的汇集了多种风格的前端UI解决方案...
Metro UI CSS（Metroui） 是一套实现了 Windows 8 的 Metro 风格界面的 CSS 框架。...
jQuery UI Bootstrap 提供了在 jQuery UI 集成 Twitter 的 Bootstrap 框架的功能...
angular-semantic-ui 是 AngularJS 为 Semantic UI 设计的原生指令集。 指令 acco...
Semantic-UI-Angular是一个纯粹的Semantic-UI组件的AngularJS1.x指令集。我们正在考...
共有 1028 人关注 Semantic UI