发布于 2015-02-18 01:02:52 | 262 次阅读 | 评论: 0 | 来源: 网友投递
Semantic UI开源前端框架
Semantic UI是一个免费开源的前端开发框架.Semantic UI拥有支持情态动词、手风琴元素、元素调光器、3D转换,甚至是评级等多种功能。
Semantic UI 1.9.0 发布,此版本现已提供下载:
更新内容如下:https://github.com/Semantic-Org/Semantic-UI/archive/1.9.0.zip
NPM 安装
npm install semantic-ui is now the recommended path for getting Semantic UI
Added npm post-install scripts which automatically install or update semantic
Gulp 任务导入
Semantic tasks are now each defined in their own file, and can be directly imported into external gulpfiles. Read more about importing tasks here
If you are using Grunt, you may be able to import these tasks using Grunt-gulp
LESS 组件导入
Semantic LESS files can now be directly included in other LESS files.
You can import all UI with @import 'src/semantic';
You can also import individual definitions using @import 'src/definitions/elements/button'.
重大改进
Card - Cards now equalize height by default using display: flex. No longer are card heights required to be specified manually to align
Flag - Reduced the file size of flag sprite to a measly 28kb (500%+ file size reduction)
Icon - Added Font Awesome 4.3 including many new icons
Input - Input with dropdowns is now much easier, see docs. action input and labeled input now use display: flex. ui action input now supports <button> tag usage (!) which support flex but not table-cell
Segment - Added plural variation ui segments that stack together in groups without using additional class names
功能增强
API - API now has an onRequest callback setting that receives the XHR promise after initializing the request
Button - Loading buttons no longer receive pointer-events in default theme. Added variable for loading button opacity.
Card - Card now has colored variations Tahnks @romuloctba
Dropdown - search selection dropdown will now close the menu when a dropdown icon is clicked
Dropdown - Added new dropdown setting, forceSelection which forces search selection to a selected value on blur. Defaults to true.
Flag - Updated Burma/Myanmar flag to current flag (was pre-2010 flag)
Form - Input rules now apply to input[type="time"]
Form Validation - get values, set values now support multiple select e.g. field[]
Form Validation - Dropdown and checkbox will now validate after interaction with on: 'blur'
Headers - Headers can now contain images alongside text, added examples to docs
Icon - Added woff2 icon files for supported browsers (20% file-size decrease) Thanks FontAwesome
Label - ribbon label can now be used inside ui image and ui card correctly
Sidebar - Sidebars in IE now work correctly with context specified
Rating - Vertical alignment of ui rating with inline content now accounts for parent line height
Bugs 修复
All Modules - Fixed bug where element destroy could remove third party events when re-initialized
Breadcrumb - Breadcrumb icon now has exact px value to alleviate vertical align issues
Card - Star / Like button colors have been fixed to match ui rating inside card
Card - Hiding a card with display: none no longer causes layout issues with (x) cards
Card - image inside content no longer has a fixed size Thanks @romuloctba
Form - info message are no longer hidden by default inside ui form
Form - Lightened error dropdown hover text color to be more legible
Dropdown - Upward dropdown now has upward arrow icon
Icon - external link and external link square has been renamed to external icon to no longer receive link styles by default
Modal - Modal now swaps to scrolling modal when close icon no longer can be displayed, instead of modal content
Steps - Fixed bug where evenly divided steps were no longer fluid
Transition - Fixes bug where moduleNamespace was being omitted
Transition - Transitions with direction now use word order dependency to prevent conflict with component directions, for example `bottom left popup slide down in transition
文档
Fixed bug with chinese mirror modal appearing on every page load when selecting chinese language
更多内容请看这里。
Semantic UI是一个免费开源的前端开发框架.Semantic UI拥有支持情态动词、手风琴元素、元素调光器、3D转换,甚至是评级等多种功能。
Semantic UI—完全语义化的前端界面开发框架,跟 Bootstrap 和 Foundation 比起来,还是有些不同的,在功能特性上、布局设计上、用户体验上均存在很多差异。
Semantic UI 特点:
文档和演示非常完善
易于学习和使用
配备网格布局
支持 Sass 和 LESS 动态样式语言
有一些非常实用的附加配置,例如inverted类。
对于社区贡献来说是比较开放的。
有一个非常好的按钮实现,情态动词,和进度条。
在许多功能上使用图标字体。
Semantic UI 对浏览器的支持:
Last 2 Versions FF, Chrome, IE (aka 10+)
Safari 6
IE 9+ (Browser prefix only)
Android 4
Blackberry 10
