vant框架cdn使用方式的简短案例

最新推荐文章于 2024-07-28 20:17:15 发布

无·法

最新推荐文章于 2024-07-28 20:17:15 发布

阅读量7.7k

点赞数

分类专栏：学习

本文链接：https://blog.csdn.net/sysdzw/article/details/98315851

版权

学习专栏收录该内容

115 篇文章 6 订阅

订阅专栏

vant框架主页：https://youzan.github.io/vant/#/zh-CN/intro

cdn方式引用的简易例子：

<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>test</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.0/lib/index.css">
</head>
<body>
  <div id="app">
    <van-cell-group>
       <van-cell title="单元格" value="内容"></van-cell>
        <van-cell title="单元格" value="内容" label="描述信息" ></van-cell>
    </van-cell-group>
  <van-button type="primary">主要按钮</van-button>
  </div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vant@2.0/lib/vant.min.js"></script>
<script>
    new Vue({
      el: '#app'
    });
</script>
</body>
</html>