美文网首页
vue初级入门(router+rem)

vue初级入门(router+rem)

作者: 大胡子111 | 来源:发表于2018-09-14 09:49 被阅读16次
案例陈述:

公共部分:公共头部,公共底部
主页:首页,我的
详情页:rem单位演示,第二个页面,第三个页面,第四个页面

关于rem

1.引入rem计算的js

在src目录下增加了config文件,config文件中有计算rem的js.并在main.js中引入了该js

2.演示效果

打开控制台,手机浏览模式,切换各个型号设备。
“操作描述”“相关解释”字体大小不一样,是因为“操作描述”使用的是rem单位,“相关解释”使用的是px单位
rem效果.png

3.相关解释

1) rem:是相对单位,相对的只是HTML根元素,rem.js就是计算根元素大小的
2) px:是相对于显示屏幕分辨率而言,值固定
github地址:https://github.com/liuyumei111/pro_name.git
下载时注意: 按照所需版本下载

本案例提交日期:Commits on Sep 13, 2018
本案例提交描述:增加rem单位计算

下载后使用
1.进入到pro_name项目目录并且打开命令行安装依赖 :npm install
2.启动服务:npm run dev   
3.打开http://localhost:8080
首页.png
我的.png

相关文章

  • vue初级入门(router+rem)

    案例陈述: 公共部分:公共头部,公共底部主页:首页,我的详情页:rem单位演示,第二个页面,第三个页面,第四个页面...

  • VUE初级入门实践

    VUE概述 生命周期 指令 内置指令 自定义指令 过滤器 内置过滤器 VUE1.0版本 VUE2.0版本(无内置过...

  • 特效化妆

    初级入门。

  • vue初级入门项目(完整)

    案例陈述: 公共部分:公共头部,公共底部主页:首页,我的详情页:第一个页面,第二个页面,第三个页面,第四个页面 g...

  • Vue 入门到实战课程

    Vue 入门到实战课程 说明 课程 VueCli3.0-小白入门 Vue2.0 小白入门教程 Vue 项目实战 在...

  • IOS入门

    IOS 入门博客链接 IOS 初级开发入门教程(一)介绍篇 IOS 初级开发入门教程(二)第一个HelloWorl...

  • VUE系列教程目录

    VUE系列教程目录 vue入门之路篇系列教程: vue最简单的入门教程+实战+Vue2+VueRouter2+we...

  • VUE系列教程目录

    VUE系列教程目录 vue入门之路篇系列教程:vue最简单的入门教程+实战+Vue2+VueRouter2+web...

  • 01vue-安装vue

    资源 1.Vue.js2.0从入门到放弃---入门实例(一)2.Vue.js入门学习(一)3.Vue官方中文Api...

  • Vue.js状态管理工具Vuex快速上手

    Vue2简单入门 Vue.js再入门 Vue.js使用vue-router构建单页应用 Vue.js状态管理工具V...

网友评论

      本文标题:vue初级入门(router+rem)

      本文链接:https://www.haomeiwen.com/subject/txlggftx.html