目标地址: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. App架构经验总结

    作者:李纪钢,网名 Keegan小钢,博客地址:http://keeganlee.me.目前在广州日报新媒体有限公司,负责移动产品的研发工作. 关于:本文整理自CSDN架构主题月子活动金牌架构师微课堂 ...

  2. CSS 工程化 小结

    CSS 工程化 组成:1.组织 (代码目录)2.优化(那种实现方式更好) 3.构建(代码完成后需要经过哪些处理步骤) 4.维护 常见问题 1.如何解决 CSS 模块化问题 1.Less Sass 等C ...

  3. 两种图片延迟加载的方法总结jquery.scrollLoading.js与jquery.lazyload.js

    估计网上能查到的最多的两种图片延迟加载方法就是jquery.scrollLoading.js与jquery.lazyload.js了,其中jquery.lazyload.js的调用方法因为有网友爆出的 ...

  4. Python面试题(练习一)

    1.Python的可变类型和不可变类型? 可变类型:list.dict(列表和字典) 不可变类型:数字.字符串.元组 2.求结果: v = dict.fromkeys(['k1','k2'],[]) ...

  5. Django模板(filter过滤器{{ }}与tag标签{% %}应用)

     模板里面过滤器与标签的应用 templates模板里面的应用参考(主要应用在这里面) <!DOCTYPE html> <html lang="en"> & ...

  6. [python工具篇][pycharm安装与配置][1]安装与设置

    1 官网下载专业版 2 打开pycharm,选择license server 激活,地址输入:http://idea.imsxm.com 3 新建工程(一个大文件夹) 4 设置字体大小(file-&g ...

  7. 在Asp.net MVC中添加一个全局的异常处理的过滤器及Log4Net的使用

    1:捕获异常新建一个异常处理的类MyExceptionAttribute捕获异常信息. //写到日志中.多个线程同时操作一个文件,造成文件的并发,这时用队列 public static Queue&l ...

  8. 九度oj 题目1080:进制转换

    题目描述: 将M进制的数X转换为N进制的数输出. 输入: 输入的第一行包括两个整数:M和N(2<=M,N<=36). 下面的一行输入一个数X,X是M进制的数,现在要求你将M进制的数X转换成 ...

  9. C++之Effective STL学习笔记Item14

    使用reserve来避免不必要的重新分配! The reserve member function allows you to minimize the number ofreallocations ...

  10. UVA 116 Unidirectional TSP(DP最短路字典序)

    Description    Unidirectional TSP  Background Problems that require minimum paths through some domai ...