我从崖边跌落 谢春花

我从崖边跌落    落入星空辽阔

银河不清不浊    不知何以摆脱

我从崖边跌落    落入丛山万座

呼声不烈不弱    梦门何故紧锁

vant首页   https://youzan.github.io/vant-weapp/#/intro

命令行 vue init webpack juwenjia    创建vue项目

引入vant UI框架  yarn add vant

图片放在assets下images    rem.js放在src下utils下

main.js文件    vant样式 移动端适配

import Vant  from 'vant';

import 'vant/lib/index.css';

import './utils/rem.js'

Vue.use(Vant);

rem的内容

// 基准大小20px = 1rem

const baseSize = 40

// 设置 rem 函数

function setRem () {

  // 当前页面宽度相对于 750 宽的缩放比例。

  const scale = document.documentElement.clientWidth / 750

  // 设置页面根节点字体大小

  document.documentElement.style.fontSize = (baseSize * Math.min(scale, 2)) + 'px'

}

// 初始化

setRem()

// 改变窗口大小时重新设置rem

window.onresize = function () {

  setRem()

}

跳转到百度 函数，在本页面打开

methods:{

  onClickRight() {

    window.open("http://www.baidu.com/", "_self");

},

}

组件适配改变

.container >>> .van-field__control,van-field__control--center{

  font-size:0.6rem;

  color:rgb(0,0,0);

}

.container  >>>  .van-nav-bar__title{

  font-size:0.8rem;

  color:rgb(0,0,0);

}

img{

  width:100%;

  height:100%;

}

.icon img{

  width:50%;

  display:flex;

  margin:0 auto ;

}

直接用 ：src = "image"   写轮播