前言
在编写前端代码的过程中，我们经常需要使用到各种 css 框架，比如 Bootstrap、Foundation、Semantic UI 等。这些框架都非常强大，但也相对比较庞大，有时我们只需要使用其中的一小部分功能，却需要引入整个框架。
今天，我要推荐一款非常轻量级的 css 框架——michaelmarkie-css_framework，并给大家介绍如何使用它。
简介
michaelmarkie-css_framework 是一个由英国的一位前端开发者 Michael Markie 所编写的 css 框架，主张从简单开始，把它称之为「一个帮助人们编写严格和易于维护的网页的框架」。
该框架非常小巧，只有 7KB 左右，但是却提供了许多常用的 css 样式和组件。我们可以使用 npm 来安装并引入它。
安装和使用
- 在项目根目录下打开终端，并输入以下命令：
npm install michaelmarkie-css_framework --save
- 在 HTML 文件中引入 css 文件：
<link rel="stylesheet" href="node_modules/michaelmarkie-css_framework/dist/mmc.css">
- 在 HTML 文件中使用 css 样式或组件：
-- -------------------- ---- ------- ---- ------ -- --- ------- ------------------------ ----------- ---- ----- --- --- ---- ---------------------- -- -- ----- ---------- ---- ---- ---- --- ---- ---------------- ---- ------------------- ------------- ---- ------------------- ------------- ------
样式和组件
michaelmarkie-css_framework 支持的样式和组件如下：
Button 按钮
-- -------------------- ---- ------- ---- ---- --- ------- ---------------------------------- ---- ------ --- ------- --------------------- --------- --------------- --------------- ---- ------- --- ------- ----------------- ------------------------------------ ------- ----------------- ---------------------------------------- ------- ----------------- ------------------------------------ ------- ----------------- ---------------------------------- ------- ----------------- ------------------------------------ ------- ----------------- ------------------------------ ------- ----------------- -------------------------------- ------- ----------------- ------------------------------ ---- ------- --- ------- ----------------- ----------------------------- ------- ----------------------------------- ------- ----------------- ----------------------------- ---- ------------ --- ------- ----------------- ---------------------------------- ------- ----------------- -------------------- --------------------------
Alert 警告框
-- -------------------- ---- ------- ---- ----- --- ---- ---------------------- -- -- ----- ---------- ---- -------- --- ---- ---------------- ----------------------- -- - ------- ----- ---------- ---- ---------------- ------------------------- -- - --------- ----- ---------- ---- ---------------- ----------------------- -- - ------- ----- ---------- ---- ---------------- ---------------------- -- - ------ ----- ---------- ---- ---------------- ----------------------- -- - ------- ----- ---------- ---- ---------------- -------------------- -- -- ---- ----- ---------- ---- ---------------- --------------------- -- - ----- ----- ---------- ---- ---------------- -------------------- -- - ---- ----- ----------
Grid 网格系统
-- -------------------- ---- ------- ---- ---------------- ---- ------------------- ------------- ---- ------------------- ------------- ------ ---- ---------------- ---- ------------------- ------------- ---- ------------------- ------------- ---- ------------------- ------------- ------ ---- ---------------- ---- ------------------- ------------- ---- ------------------- ------------- ---- ------------------- ------------- ---- ------------------- ------------- ------
总结
michaelmarkie-css_framework 是一个非常小巧的 css 框架，但是提供了许多常用的 css 样式和组件。它非常容易使用，只需引入 css 文件并使用样式或组件即可。
此外，michaelmarkie-css_framework 的源码非常易于阅读和修改，我们也可以根据自己的需求来修改和扩展它。我相信它会让您编写严格和易于维护的网页更加轻松愉快。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006734a890c4f727758374a