Coder Social home page Coder Social logo

imac8t / 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.1 MB

A lightweight, flexible css framework that focus on mobile.

Home Page: http://getmobicss.com/

License: MIT License

JavaScript 5.92% CSS 49.87% 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

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.