实用的前端响应式框架

jopen 11年前

InK

实用的前端响应式框架

Ink is an interface kit for quick development of web interfaces, simple to use and expand on. It uses a combination of HTML, CSS and JavaScript to offer modern solutions for building layouts, display common interface elements and implement interactive features that are content-centric and user friendly for both your audience and your designers & developers.

  • HTML & CSS: layout, navigation, typography, icons, forms, alerts, tables
  • JS: Gallery, Modal, Table, Tree View, Sortable List Date Picker, Tabs, Form Validator, Behaviors (Dockable, Collapsible, Close)
  • Other: Sass Mixins

 

GroundworkCSS Beta

实用的前端响应式框架

GroundworkCSS's flexible grid system enables you to do rapid development and scales to fit any screen size, from handheld devices to large format televisions. GroundworkCSS has been built from the ground up with the incredibly powerful CSS preprocessor, Sass. Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.

  • HTML & CSS: grids, layout, typography, buttons, tiles, forms, tables, icons, social icons, responsive text, messages, alerts
  • JS: Navigation, Tabs, Modals, Tooltips, Cycle2
  • Other: Sass Mixins

 

Ivory

实用的前端响应式框架

Flexible, & Powerful responsive web framework, Makes your web development faster and easier. It takes you all the way from 1200px on down to 320px.

  • HTML & CSS: grids, typography, forms, buttons, alerts, paginations, breadcrumb, lists, tables
  • JS: Tooltip, Tabs, Toggle switch, accordion

 

Zurb

实用的前端响应式框架

Foundation is made by Zurb, a product design company in Campbell, California. FOundation is the most advanced responsive front-end framework, it has many template layouts, css style for UI components and also good collection of their own Javascript plugins.

  • HTML & CSS: grids, layout templates, icon fonts, responsive tables, SVG social icons, pagination, breadcrumbs, side nav, buttons, typography, labels, alert boxes, panels, pricing tables, progress bars, tables, thumbnails
  • JS: Dropdown buttons, split buttons, switches, flex video, lightbox, drop down, Interchange (switch image sizes for responsive layout), Joyride Tour guide, Magellan sticky nav, Orbit image slider, Reveal modal window, Tabs, tooltips
  • Other: Custom skinned forms, SCSS Mixin

 

Grumby

实用的前端响应式框架

Gumby 2 is built with the power of Sass. Sass is a powerful CSS preprocessor which allows us to develop Gumby itself with much more speed — and gives you new tools to quickly customize and build on top of the Gumby Framework.

  • HTML & CSS: grids, forms, buttons, navigation, labels, entypo Icons
  • JS: Toggles & Switches, Dropdowns, tabs, Drawer Modal windows
  • Other: Custom skinned forms, SASS & Compass

 

HTML KickStart

实用的前端响应式框架

Ultra–Lean HTML5, CSS, & JS Building Blocks for Rapid Website Production. It has a comprehensive coverage of UI components and also a few useful Javascript plugins. It's aiming to be designer friendly.

  • HTML & CSS: grids, typography, buttons, button bars, lists, tables, icons, breadcrumbs, images, forms
  • JS: Menu, Tooltips, Syntax Hightlighter, Tabs, Slidedhow, Form validations
  • Other: Extra CSS Helpers

 

Maxmertkit

实用的前端响应式框架

This framework was created Vetrenko Maxim Sergeevich, to make programmer's lives much easier.axmerkit is a CSS framework based on widget-modifier coding style.

  • HTML & CSS: grids, layouts, typograpghy, badges, buttons, carets, forms, icons, labels, menu, progressbar, tables, dropdown, tooltips
  • JS: Affix, buttons, Carousel, Modal, Notify, Popup, Scrollspy, Tabs
  • Other: Sass, Coffee Script

 

推ter Bootstrap

实用的前端响应式框架

推ter Bootstrap has been with us for quite a while, with its comprehensive UI components and easy to use grid and components, bootstrap has become many designer/developer favourite tools for rapid development. There are many third party Bootstrap goodies and Javascript plugins available too.

  • HTML & CSS: grids, layouts, typography, code, tables, forms, buttons, images, icons, buttons groups, navs, breadcrumbs, pagination, labels, badges, thumbnails, alerts, progressbars
  • JS: Transitions, Modals, Dropdowns, Scrollspy, Tabs, Tooltips, Popovers, Alerts, Buttons, Collapges, Carousels, Typeaheads, Affixes
  • Other: Customizer, LESS CSS

 

Skeleton

实用的前端响应式框架

Skeleton is a small collection of CSS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone. Skeleton is built on three core principles: Responsive Grid Down to Mobile, Fast to Start and Style Agnostic. Skeleton is quite a popular choice for most developer because it's lightweight and easy to use.

  • HTML & CSS: GRids, Typography, Buttons, Forms, Media Queries

 

Kube

实用的前端响应式框架

From the creator of Redactor editor, imperavi has also released a front-end framework to make designer/developer's life easier. Minimalistic and sufficient for everything, adaptive and responsive. Revolutionary flexible grid and beautiful typography. Absolute freedom with no imposed styling.

  • HTML & CSS: Typography, grids, forms, tables, buttons, navs, icons
  • JS: buttons, tabs, pills
  • Other: LESS CSS

 

Helium

实用的前端响应式框架

Helium is a frontend responsive web framework for rapid prototyping and production-ready development using HTML5 and CSS3. In many ways it is similar to both 推ter Bootstrap and ZURB Foundation - in fact, it uses bits of their code. Unlike either of these two frameworks, however, Helium is designed to be much more lightweight and easier to tinker with. Think of it as a classic car where you can pop open the hood and easily work on the engine. The compiled default CSS file weighs in at a comparatively tiny 30k, versus approximately 100k for Bootstrap and almost 200k for Foundation.

  • HTML & CSS: grids, buttons, pills, typography, forms
  • JS: Dropdowns, Form validation, Modal windows
  • Other: Sass & Compass

 

The Markup Framework

实用的前端响应式框架

The Markup Framework is a collection of layouts, widgets, typographic styles and other UI componenets to use as a starting point for your own Web designs.

  • HTML & CSS: layouts, grids, typography, forms, buttons, heading, box, breadcrumbs, message, navlist, nav menu,
  • JS: No Javascripts, pure CSS

 

Topcoat

实用的前端响应式框架

Topcoat is a collection of CSS for clean and fast web apps. It is an open source library of user interface elements that are built without any JavaScript.

  • HTML & CSS: icons, fonts, buttons, breadcrumbs, button bar, forms, Dropdown, Split-action, Slide switch, Tabs, Toggle buttons, Select, Slider, Spinners
  • JS: No Javascripts, pure CSS

 

PureCSS

实用的前端响应式框架

Pure is ridiculously tiny. The entire set of modules clocks in at 5.7KB minified and gzipped, without forgoing responsive styles, design, or ease of use. Crafted with mobile devices in mind, it was important to us to keep our file sizes small, and every line of CSS was carefully considered. If you decide to only use a subset of these modules, you'll save even more bytes.

  • HTML & CSS: grids, typography, forms, buttons, tables, menus
  • JS: No Javascripts, pure CSS
  • Other: Skin builder, YU Library