Coder Social home page Coder Social logo

rlugojr / mobi.css Goto Github PK

View Code? Open in Web Editor NEW

This project forked from mobi-css/mobi.css

0.0 2.0 0.0 3.11 MB

A lightweight, flexible css framework that focus on mobile.

Home Page: http://getmobicss.com/

License: MIT License

CSS 49.87% JavaScript 5.92% HTML 44.21%

mobi.css's Introduction

Mobi.css Logo

English | 简体中文

Build Status npm package npm downloads

Mobi.css

A lightweight, flexible css framework that focus on mobile.

Introduction

  • Only 2.8kb after minified and gzipped, less than Skeleton, Pure.css and Bootstrap v4, etc
  • Heavy use of flexbox, super flexible, less than 10 lines of custom style in the official site
  • Focus on mobile, show mobile pages in desktop with a sidebar on the left or right

Getting started

You can download Mobi.css in this page, then use dist/mobi.min.css for the compressed version.

Or simply insert this to your <head>:

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/mobi.min.css" />

Or use npm to install:

npm install --save mobi.css

You can also build Mobi.css to your project if you are using Sass:

@import 'mobi.css/src/mobi';

Be sure you have added node_modules to your Sass's load_paths.

Browser Support

iOS

  • Last 5 iOS versions

Android

  • Last 5 Android versions
  • Last 5 ChromeAndroid versions
  • Last 5 UCAndroid versions (*)
  • Last 5 FirefoxAndroid versions (*)
  • Last 5 OperaMobile versions (*)
  • Last 5 OperaMini versions (*)
  • Last 5 Samsung versions (*)

Others

  • Last 3 Chrome versions
  • Last 3 Firefox versions
  • Last 3 Safari versions
  • Last 3 Edge versions
  • Last 5 ExplorerMobile versions (*)

Note

  • Use Autoprefixer to ensure Mobi.css works on all major mobile devices
  • Browsers query comes from Browserslist
  • Browsers marked as (*) were not well tested, but they should work fine

Contributing

Getting started

npm install
npm start

Open http://localhost:8000/

Testing

npm test

Who's using Mobi.css?

Tell me if you are using Mobi.css!

Contributors

License

MIT

Mobi.css

轻量灵活的移动端 CSS 框架。

介绍

  • 压缩后只有 4.6kb，比 Skeleton、Pure.css、Bootstrap 等所有 CSS 库都小
  • 大量使用 Flexbox ，非常灵活，官方网站只有不到 10 行的自定义样式
  • 专注于移动端，桌面端端相当于展示的还是移动端的页面，不过可以在左侧或右侧加上侧边栏

开始使用

你可以在这个页面下载 Mobi.css，然后使用压缩后的版本：dist/mobi.min.css。

或者简单的将以下代码插入到 <head> 中：

<link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css" />

或者使用 npm 安装：

npm install --save mobi.css

如果你用的是 Sass，那么也可以在自己的项目中构建 Mobi.css：

@import 'mobi.css/src/mobi';

注意你需要将 node_modules 添加到 Sass 的 load_paths 中。

支持的浏览器

iOS

  • Last 5 iOS versions

安卓

  • Last 5 Android versions
  • Last 5 ChromeAndroid versions
  • Last 5 UCAndroid versions (*)
  • Last 5 FirefoxAndroid versions (*)
  • Last 5 OperaMobile versions (*)
  • Last 5 OperaMini versions (*)
  • Last 5 Samsung versions (*)

其他浏览器

  • Last 3 Chrome versions
  • Last 3 Firefox versions
  • Last 3 Safari versions
  • Last 3 Edge versions
  • Last 5 ExplorerMobile versions (*)

备注

  • Mobi.css 使用 Autoprefixer 来保证能兼容主流的移动端浏览器
  • 浏览器查询语句来自于 Browserslist
  • 标注为 (*) 的浏览器可能没有很好的测试，但是应该能够正常工作

参与贡献

如何开始

npm install
npm start

打开 http://localhost:8000/

测试

npm test

谁在用 Mobi.css?

告诉我你也在用 Mobi.css！

贡献者

开源协议

MIT

mobi.css's People

Contributors

xcatliu avatar cht8687 avatar pixcai avatar hxlniada avatar etnol avatar breeze4 avatar

Watchers

Ray Lugo, Jr. avatar avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.