在创建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. ubuntu 单网卡双 ip

    局域网一套物理网络里有两个 ip 段,单网卡设置多 ip 可实现同时访问两个网段. $ cat /etc/network/interfaces # interfaces(5) file used by ...

  2. bjfu1332 简单动规

    挺简单的动态规划题.我用记忆化搜索打的.直接上代码: /* * Author : ben */ #include <cstdio> #include <cstdlib> #in ...

  3. aop学习总结三----aop的相关概念

    aop学习总结三----aop的相关概念 public Object invoke(Object proxy, Method method, Object[] args) throws Throwab ...

  4. 基于地理位置信息的traceroute

    我们在机房选择.測试网络的质量的时候,往往仅仅依据跳数.延迟.抖动.网络吞吐量等指标来衡量,非常多时候跳数并不能全然显示网络拓扑优劣,于是写了个traceroute结合whois的小脚本来直观显示每一 ...

  5. C++ xml 解析器

    C++的xml解析器有很多,这个知乎回答里有一个列表:https://www.zhihu.com/question/32046606 下面使用其中的RapidXml试试. 官方地址: https:// ...

  6. UITabBar 设置选中、未选中状态下title的字体颜色

    一.如果只是设置选中状态的字体颜色,使用 tintColor  就可以达到效果 self.tabBar.tintColor = [UIColor redColor]; 二.但如果要将未选中状态和选中状 ...

  7. codeforces B. Convex Shape 解题报告

    题目链接:http://codeforces.com/problemset/problem/275/B 题目内容:给出一个n * m 大小的grid,上面只有 black 和 white 两种颜色填充 ...

  8. html5--3.16 button元素

    html5--3.16 button元素 学习要点 掌握button元素的使用 button元素 用来建立一个按钮从功能上来说,与input元素建立的按钮相同 button元素是双标签,其内部可以配置 ...

  9. hdu-5742 It's All In The Mind(数学)

    题目链接: It's All In The Mind Time Limit: 2000/1000 MS (Java/Others)     Memory Limit: 65536/65536 K (J ...

  10. python装饰器精髓代码

    #!/usr/bin/env python #-*- coding:utf-8 -*- import time def foo(func): def inner(): print('fs...') f ...