stylus

优点:css之中使用一些变量,方便我们快速编写css

项目中我们使用css开发的辅助工具帮助我们开发网站样式

安装:终端打开我们项目的文件夹

npm install stylus --save
npm install stylus-loader --save
// --save 是线上和开发模式都用 --save-dev只在开发环境中用

样式冲突 scoped关键字

避免一个组件中的样式对另外组件样式的影响

局部化样式
<style lang="stylus" scoped></style>

移动端布局我们采用rem布局方式

1rem = html文件中 font-sizefont-size (根据设计师给的几倍图)

iconfont使用

官网下载字体文件和iconfont.css

然后修改iconfont.css  中字体文件的路径

然后根路径引入 iconfont。css

y

vue项目开始 首页 part1的更多相关文章

  1. 前端Vue项目——首页/课程页面开发及Axios请求

    一.首页轮播图 1.elementUI走马灯 elementUI中 Carousel 走马灯,可以在有限空间内,循环播放同一类型的图片.文字等内容. 这里使用指示器样式,可以将指示器的显示位置设置在容 ...

  2. Vue项目——去哪网(首页部分)

    业务逻辑 通过gitee创立各个分支,比如swiper,header,recommende等分支,其实就是整个页面上的每个模块.模块化是公司级别项目开发的基准,每个人在各自的分支上进行代码的编写,而对 ...

  3. vue项目中视频播放结束返回首页出现1秒左右的白屏问题

    vue项目的性能优化问题,一直以来都是大家比较关注的. 近日负责的项目中,使用了SignalR实时通讯,客户端中点击发起播放视频的请求到服务器,服务器接到请求后再调用前端的播放视频方法,以此来达到播放 ...

  4. vue项目打包之后首页白屏的问题

    本地的vue项目在server端浏览没问题,但是执行npm run build 打包之后在本地预览是白屏. 解决方法 1.路径问题 在config文件夹中找到index.js打开把assetsPubl ...

  5. 基于Mint UI和MUI开发VUE项目一之环境搭建和首页的实现

    一:简介 Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要.通过它,可以快速构建出风格统一的页面,提升开发效率.真正意义上的按需加载组件.可以只加载声明过的组件及其样式 ...

  6. vue项目构建与实战

    关于 微信公众号:前端呼啦圈(Love-FED) 我的博客:劳卜的博客 知乎专栏:前端呼啦圈 前言 由于vue相对来说比较平缓的学习过程和新颖的技术思路,使其受到了广大前后端开发者的青睐,同时其通俗易 ...

  7. Vue项目搭建完整剖析全过程

    Vue项目搭建完整剖析全过程 项目源码地址:https://github.com/ballyalex 有帮助的话就加个星星呗~!  项目技术栈:vue+webpack+bower+sass+axios ...

  8. 在nginx上部署vue项目(history模式);

    在nginx上部署vue项目(history模式): vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想has ...

  9. vue项目 构建 打包 发布 三部曲

    一.vue项目的创建 1.首先第一肯定是要有Node.js及npm这个不多说了2.安装脚手架 此时可以直接浏览-但是现在肯定有很多小白想将他发布到gitHub上并可以浏览,使用vue全家桶制作自己的博 ...

随机推荐

  1. Java 用户输入

    章节 Java 基础 Java 简介 Java 环境搭建 Java 基本语法 Java 注释 Java 变量 Java 数据类型 Java 字符串 Java 类型转换 Java 运算符 Java 字符 ...

  2. Linux netfliter 架构

    netfliter 简介 netfilter是在Linux 2.4.X内核引入的一个子系统,它提供了一个抽象的.通用框架,这个框架提供了一整套的钩子函数的管理机制.包括钩子函数的原型定义,注册,注销等 ...

  3. MQTT 协议学习:005-发布消息 与 对应报文 (PUBLISH、PUBACK、PUBREC、PUBREL)

    背景 当有订阅者订阅了有关的主题以后,通过发布消息的消息的动作,可以让订阅者收到对应主题的消息. 根据不同的QoS 等级,通信的动作也略有不同. PUBLISH – 发布消息 报文 PUBLISH控制 ...

  4. Spring Boot2(007):关于Spring beans、依赖注入 和 @SpringBootApplication 注解

    一.关于Spring beans 和 依赖注入(Dependency Injection) spring boot 和 Spring 全家桶无缝衔接,开发过程中可以很轻松地使用 Spring 全家桶的 ...

  5. 033-PHP取1-100的随机数

    <?php // 生成一个随机数 // 从1到100中取得随机数 for ($index = 0; $index < 100; $index++) { $number = (rand() ...

  6. 056-for循环中continue的使用

    <?php ; $i <= ; $i++) { //for循环输出数值 == ) //判断变量是否为3的整数倍 { continue;//跳过本次循环剩余语句 } echo "$ ...

  7. 好记性不如烂笔头--shell参数及shell判断if系列

    $0 当前脚本的文件名$n 传递给脚本或函数的参数.n 是一个数字,表示第几个参数.例如,第一个参数是$1,第二个参数是$2$# 传递给脚本或函数的参数个数$* 传递给脚本或函数的所有参数$@ 传递给 ...

  8. 十三、react-router 4.x的基本配置

    路由的定义及作用 根组件根据客户端不同的请求网址显示时,要卸载上一个组件,再挂载下一个组件,如果手动操作话将是一个巨大麻烦.具体过程如下图: [根组件] ↑ [首页组件] [新闻组件] [商品组件] ...

  9. Marvolo Gaunt's Ring(巧妙利用前后缀进行模拟)

    Description Professor Dumbledore is helping Harry destroy the Horcruxes. He went to Gaunt Shack as h ...

  10. TX2_安装view_team

    TX2上的帐号是:1317149963,dc200820305233 参考网站:https://blog.csdn.net/qq_33512213/article/details/90050792 安 ...