常见的前端ui框架怎么使用?看一下这文章就会咯

614 阅读1分钟

image.png

  1. Bootstrap: www.bootcss.com/
  2. Element UI: element.eleme.io/#/zh-CN
  3. Ant Design: ant.design/index-cn
  4. Ant Design Mobile: mobile.ant.design/docs/react/…
  5. Material Design: material.io/design/
  6. Material Design 科普:www.uisdc.com/material-de…
  7. Materialize: https://materializecss
  8. Material UI: material-ui.com/zh/
  9. Vue Material:vuematerial.io/
  10. Vuetify:vuetifyjs.com/zh-Hans/
  11. Mint UI: mint-ui.github.io/#!/zh-cn
  12. VUX: vux.li/
  13. MUI: dev.dcloud.net.cn/mui/
  14. Vant: youzan.github.io/vant/#/zh-C…

以上就是一些常见组件库的地址啦,那怎么样才能高效的使用组件库呢?看下面这句话:

"一搜 二开 三引 四选 五看 六粘 七改" ------帅鱼皮的老小伙

好啦,知道技巧了那就要直接实践一波康康。

一搜

先搜索想要的组件库

二开

打开官网,打开文档,优先找【快速开始/开始使用】

三引

引入组件库
- 下载本地代码包
- 使用包管理工具npm/yarn
- CDN引入(推荐)

四选

根据你的网页布局/动效等需要,选择组件

五看

找到想要使用的组件之后呢,就要把这个组件对应的这一部文档看完全了。
比如说组件的 【描述,注意事项,用法,参数,触发的方法】

六粘

复制组件代码到你自己的项目文件,或者网页文件中

七改

最后,
根据你的需求,改变组件的内容。
根据组件文档中的【基本参数】来改变样式来改变组件的样式,还有改变组件的行为。
也可以通过改变类名来改变样式

如果文字看不下去就去看一下下面这两个视频吧

不想学习就去看看我亚索五杀的视频也行

95425ffe82c2cfebd91e743e9faab16.jpg