MUI 九宫格改造成六宫格

1、下载mui库文件，放到项目的src下的lib文件夹中2、main.js 文件中导入 mui 样式//导入muiimport './lib/mui/dist/css/mui.min.css'import './lib/mui/dist/css/icons-extra.css'3、在mui 样例中找到九宫格案例后，右键查看源代码，复制九宫格的代码到对应的 vue 组件的对应位置...

开心果小魏

4782人浏览 · 2018-12-07 13:43:02

开心果小魏 · 2018-12-07 13:43:02 发布

1、下载mui库文件，放到项目的src下的lib文件夹中

2、main.js 文件中导入 mui 样式

//导入mui
import './lib/mui/dist/css/mui.min.css'
import './lib/mui/dist/css/icons-extra.css'

3、在mui 样例中找到九宫格案例后，右键查看源代码，复制九宫格的代码到对应的 vue 组件的对应位置

4、在网页中右键审查元素中，找到上面的 ul 和 li 用到的类，修改类样式，完成九宫格的布局

5、这里注意一下，修改最后面整体的背景颜色，是需要在 index.html 文件中修改 body 的样式

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^