在创建Vue项目时一般会用默认的项目标题和图标，如下图所示:

不是很美观也可能不符合项目的需求，所以有时候就需要改变项目在浏览器上方的标签名称或者图标。

找到项目根目录的index.html，如图：

进去就能够修改title，也就是在浏览器上方的标题

<meta name="viewport" content="width=device-width,initial-scale=1.0">

<title>template</title>

如果需要在标题旁边加入自定义的图标，你需要把自己的的图片放在static目录下（不要放在src目录下，浏览器会找不到）
将favicon.ico的图标文件放到static文件夹内，在index.html的head中添加：

<link rel="icon" type="image/x-icon" href="static/favicon.ico">

保存并刷新浏览器，看浏览器图标已经正确设置上了。

web前端_Vue框架_设置浏览器上方的标题和图标的更多相关文章

  1. Web前端三大框架_angular.js 6.0（二）

    Web前端三大框架_angular.js 6.0(一) 需要视频教程,看头像昵称处 一.Angular 6.0  1.1样式 html中引入样式:内嵌式,外链式,行内式. ng6中组件引入样式的方式也 ...

  2. Web前端MVC框架的意义分析

    前言: Web前端开发是Web技术发展中的一个重要组成部分,在传统的前端开发中由于外界因素的影响导致其开发形式呈现出简单化的特点,即以页面为主体来展示界面中的信息.然而随着科学技术的不断进步,Web前 ...

  3. 2015年最全的移动WEB前端UI框架

    目前,众多互联网公司APP都嵌入了大量的HTML5,移动端的开发越来越重视,HTML5的运用场景也越来越多了.在移动WEB开发的过程中,使用合适的移动WEB UI框架可以大大提升我们的开发效率.下面P ...

  4. web前端UI框架

    分类:WEB前端 时间:2016年1月13日 目前,众多互联网公司APP都嵌入了大量的HTML5,移动端的开发越来越重视,HTML5的运用场景也越来越多了.在移动WEB开发的过程中,使用合适的移动WE ...

  5. 收集几个Web前端UI框架

    原文:http://www.isaced.com/post-200.html 关于Web前端UI库/框架,我觉得是非常方便的东西,对于我们这种业余的Web开发人员,有时候要写点前端代码的时候把UI框架 ...

  6. web前端技术框架选型参考

    一.出发点 随着Web技术的不断发展,前端架构框架.UI框架.构建工具.CSS预处理等层出不穷,各有千秋.太多的框架在形成初期,都曾在web领域 掀起过一场技术浪潮,可有些却仅仅是昙花一现,随着他们用 ...

  7. Web前端三大框架_vue源码笔记

    一.VUE 1.1 MVVM VUE也是基于MVVM模式实现的.特点就是数据双向绑定 在MVVM模式中,分成三个部分: M 模型 model V 视图 view VM 视图-模型 view-model ...

  8. Bootstrap（Web前端CSS框架）

    官方定义: Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile fi ...

  9. vue,react,angular三大web前端流行框架简单对比

    常用的到的网站 vue学习库: https://github.com/vuejs/awesome-vue#carousel (json数据的格式化,提高本地测试的效率) json在线编辑: http: ...

随机推荐

  1. On ROWNUM and Limiting Results

    This issue's Ask Tom column is a little different from the typical column. I receive many questions ...

  2. ubuntu 12.04改变源（转载）

    来源:http://blog.ubuntusoft.com/ubuntu-update-source.html#.Uq_PP9KBmxh 其它版本的修改方式相识.尽量使用原生工具来修改(见下方). 手 ...

  3. jquery设置多个css样式

    $(selector).css({property:value, property:value, ...}) 实例: $("p").css({ "color": ...

  4. Qt笔记之使用设计器自定义窗口标题栏

    1.在窗口显示之前,设置WindowFlags为FramelessWindowHint,以产生一个没有边界的窗口 例如 Widget::Widget(QWidget *parent) : QWidge ...

  5. 无法启动FTP站点，服务目前停止

    在本地搭建了一个FTP服务器(windows搭建FTP服务器实战),再启动的时候提示错误: 错误提示信息: 根据提示可以查出问题原因:FTP服务没有开启 启动服务,再次重启站点服务.一切OK. 亲测好 ...

  6. ffmpeg 中av_rescale_rnd 的含义

    http://blog.csdn.net/fireroll/article/details/8485482 一.函数声明: int64_t av_rescale_rnd(int64_t a, int6 ...

  7. codeforces 469B Chat Online 解题报告

    题目链接:http://codeforces.com/problemset/problem/469/B 题目意思:给出 Little Z 的上线时间段,分别是[a1, b1], [a2, b2],.. ...

  8. SDK Manager中勾选项

    运行SDK Manager 勾选对应版本的SDK,从这里基本可以知道一个Android版本对应着一个版本的API. 其中每个包都有这么几个文件: Documentation for Android S ...

  9. tflearn 数据集太大无法加载进内存问题？——使用image_preloader 或者是 hdf5 dataset to deal with that issue

    tflearn 数据集太大无法加载进内存问题? Hi, all! I'm trying to train deep net on a big dataset that doesn't fit into ...

  10. Spring 事务管理高级应用难点剖析: 第 2 部分

    本文是“Spring 事务管理高级应用难点剖析” 系列文章的第 2 部分,作者将继续深入剖析在实际 Spring 事务管理应用中容易遇见的一些难点,包括混合使用多种数据访问技术(如 Spring JD ...