目标地址:https://www.vyuan8.com/vyuan/plugin.php?id=vyuan_fangchan&module=fangchan&pid=10079&fid=70823

页面可以从上到下分为若干组件,导航,swiper幻灯,详情,推荐,底部 5个组件

1.先搞个头部导航

把css和html搞过来之后 发现总是不对 ,什么问题呢

原来是热刷新的问题,也就是你再vscode编辑修改了,但是在浏览器看到的效果不是实时的,nodejs有个热刷新的命令

cnpm install -g supervisor

先在命令行停止项目,然后执行 supervisor 后再npm run dev

Header.vue

效果:

少了个箭头,要加载 iconfont.css,而且是全局的css

首先配置nuxt.config.js


然后把静态样式文件放到该目录

Npm run dev 效果出来了

4.【nuxt起步】-具体练习一个h5实例的更多相关文章

  1. 6.【nuxt起步】-完成一个静态的页面

    1.接下来新建/component/maincontent.vue 把这些html代码copy到maincontent.vue 发现格式比较难看,就格式化一下 2.插件安装 beautify,安装后重 ...

  2. 使用Phaser开发你的第一个H5游戏(一)

    本文来自网易云社区 作者:王鸽 不知你是否还记得当年风靡一时的2048这个游戏,一个简单而又不简单的游戏,总会让你在空闲时间玩上一会儿. 在这篇文章里,我们将使用开源的H5框架--Phaser来重现这 ...

  3. Android 只开启一个Activity实例

    在一个Activity中,多次调用startActivity()来启动另一个Activity,要想只生成一个Activity实例,方法有两种. 方法一:设置起动模式 一个Activity有四种启动模式 ...

  4. 将oracle冷备份恢复到另外一个数据库实例中

    因更换服务器需要将Oracle数据库转移到另外台Oracle中.说明: 1.测试环境为:windows server2003 和 oracle 10g. 2.2台服务器安装的程序目录一样,数据目录不一 ...

  5. 第一个python实例--监控cpu

    #第一个python实例:监控cpu #/bin/bash/env Python from __future__ import print_function from collections impo ...

  6. 一个H5的3D滑动组件实现(兼容2D模式)

    起由 原始需求来源于一个项目的某个功能,要求实现3D图片轮播效果,而已有的组件大多是普通的2D图片轮播,于是重新造了一个轮子,实现了一个既支持2D,又支持3D的滑动.轮播组件. 实现思路 刚一开始肯定 ...

  7. servlet的一个web容器中有且只有一个servlet实例或有多个实例的理解1

    servlet的一个web容器中有且只有一个servlet实例或有多个实例的理解 (2013-06-19 19:30:40) 转载▼     servlet的非线程安全,action的线程安全 对提交 ...

  8. 12C RAC中的一个数据库实例自动crash并报ORA-27157、ORA-27300等错误

    rhel7.2上安装12C RAC数据库后,其中一个数据库实例经常会自动crash.查看alert日志发现以下错误信息: Errors in file /d12/app/oracle/diag/rdb ...

  9. 一个 XSD 实例

    一个 XSD 实例 本节会为您演示如何编写一个 XML Schema.您还将学习到编写 schema 的不同方法. XML 文档 让我们看看这个名为 "shiporder.xml" ...

随机推荐

  1. Jenkins自动化搭建测试环境(一)

    Jenkins基础 首先上官网jenkins.io上下载最新的Jenkins war包 将下载完成的war包解压 java -jar jenkins.war 接下来使用浏览器访问localhost:8 ...

  2. MongoDB学习-->命令行增删改查&JAVA驱动操作Mongodb

    MongoDB 是一个基于分布式文件存储的数据库. 由 C++ 语言编写.旨在为 WEB 应用提供可扩展的高性能数据存储解决方案. MongoDB 是一个介于关系数据库和非关系数据库之间的产品,是非关 ...

  3. webdriver高级应用- 使用日志模块记录测试过程中的信息

    在自动化脚本执行过程中,使用Python的日志模块记录在测试用例执行过程中一些重要信息或者错误日志等,用于监控和后续调试脚本. 在pycharm下新建工程,并创建Log.py.Logger.conf以 ...

  4. Cookie和Session的作用和工作原理

    一.Cookie详解 (1)简介 因为HTTP协议是无状态的,即服务器不知道用户上一次做了什么,这严重阻碍了交互式Web应用程序的实现.在典型的网上购物场景中,用户浏览了几个页面,买了一盒饼干和两饮料 ...

  5. django model的设计

    1 设计blog的显示界面: 在blog/admin.py修改 from django.contrib import admin from blog.models import BlogPost # ...

  6. 前端CSS规范大全(转)

    一.文件规范 1.文件均归档至约定的目录中. 具体要求通过豆瓣的CSS规范进行讲解: 所有的CSS分为两大类:通用类和业务类.通用的CSS文件,放在如下目录中: 基本样式库 /css/core 通用U ...

  7. Linux环境CentOS6.9安装配置Elasticsearch6.2.2最全详细教程

    Linux环境CentOS6.9安装配置Elasticsearch6.2.2最全详细教程 前言 第一步:下载Elasticsearch6.2.2 第二步:创建应用程序目录 第四步:创建Elastics ...

  8. 学习的一些mybatis

    MyBatis入门基础(一) 阅读目录 一:对原生态JDBC问题的总结 二:MyBatis框架 三:mybatis入门程序 四:mybatis和Hibernate的本质区别与应用场景 五:小结 回到顶 ...

  9. Keepalived中Master和Backup角色选举策略

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://ixdba.blog.51cto.com/2895551/1544858 在Kee ...

  10. vue-cli3 vue.config.js配置

    module.exports = { // 基本路径 baseUrl: '', // 输出文件目录 outputDir: 'dist', // eslint-loader 是否在保存的时候检查 lin ...