【vue】设置网页的标题和图标

最新推荐文章于 2023-12-20 11:14:06 发布
最新推荐文章于 2023-12-20 11:14:06 发布
阅读量2.7k 收藏 6
点赞数 2
分类专栏： Vue 网页 文章标签： vue html web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/junxianzhou/article/details/109198313
版权

【vue】设置网页在浏览器上打开时的标题和图标

设置步骤：

  1. 在根目录下找到并打开index.html文件；
  2. 设置的图标需要存放在static文件夹下（亲测存放在该文件夹下浏览器才能读取到）；
  3. 在index.html → head → title标签里修改自己想要的名称；
  4. 然后在head下引入图标：<link rel="Shortcut Icon" href="static/favicon.ico" type="image/x-icon">

在这里插入图片描述

喵喵学姐
关注
  • 2
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue项目动态配置网站图标
weixin_46325225的博客
11-17 662
3、在index.html页面使用缓存中存储的图标地址。2、在main.js中将配置的图标地址存入缓存。1、在.env中配置图标地址。
vue网页图片以及名称
03-26
在这个“vue网页图片以及名称”的主题中，我们将探讨如何在Vue项目中处理图片资源和显示图片名称。 首先，Vue.js 提供了一个名为`<template>`的语法糖，用于定义视图模板。在模板中，我们可以使用`<img>`标签来插入...
Vue项目设置网站小徽标
做笔记/记录遇到的前端bug
06-30 636
Vue项目中自定义浏览器小徽标图文详解
VUE3 自定义 网页标题与图标
qq_31634833的博客
03-15 513
VUE3 自定义 网页标题与图标 1 做一个名为 favicon.ico的logo图 放在 /public/下面，替换原有的 favicon.ico，同时删除 /public/img/所有图片。 2 根目录下新建vue.config.js， module.exports = { pwa: { iconPaths: { favicon32: 'favicon.ico', favicon16: 'favicon.ico',
Vue设置浏览器的标题title和图标icon
明知山
08-29 2623
效果图 设置浏览器的title <template> <div>hello world</div> </template> <script> export default { data() { return {}; }, mounted: function() { //使用钩子函数挂载 documen...
Vue项目设置浏览器小图标
m0_46627730的博客
09-06 2072
开发Vue项目时，打开浏览器查看时会发觉自己的网页小图标是空白的，不像其他网页一样有各自的小图标，接下来就和大家说一下如何设置浏览器小图标吧。 最终效果： 实现方式： 1：将所需的图片放入static文件夹下，例如我放在static/imgs ![在这里插入图片描述](https://img-blog.csdnimg.cn/20200906212306931.png#pic_center 2：在index.html中引入图标即可 加入这行代码：<link rel ="shortcut icon
让你在Vuepress中可以直接使用FontAwesome的图标
08-08
3. **创建自定义Vue组件**：在Vuepress的`src/components`目录下，创建一个名为`FontAwesome.vue`的文件，用于导入和注册Font Awesome图标： ```vue import { library } from '@fortawesome/fontawesome-...
vue前段开发网页图片及名称
03-26
在标题“vue前段开发网页图片及名称”中，我们可以理解为讨论的是如何在Vue项目中处理和组织网页中的图片资源，以及如何进行有效的文件命名。 Vue.js是一个轻量级的前端框架，它简化了JavaScript应用的构建过程，...
HTML+JQUERY+Vue实现天气查询网页
04-05
它通过一系列的标签来描述网页的各个部分，如标题、段落、图片等。在本项目中，`index.html` 文件很可能是主网页，包含了网页的基本布局和元素，通过引用外部资源如 CSS 和 JavaScript 文件来实现功能和样式。 ...
Vue项目添加动态浏览器头部title的方法
10-18
主要介绍了Vue项目添加动态浏览器头部title的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue如何设置网站标题和logo图标
夏日漱石的博客
07-27 4431
vue如何设置网站标题和logo图标
Vue如何设置网站的小图标favicon
qq_43660897的博客
08-02 1259
把需要设置的icon放到static文件夹中 然后在index.html中引入 <link rel="icon" href="./static/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" type="image/x-icon" href="./static/favicon.ico" /> 然后...
vue设置页面标题title
weixin_52046784的博客
09-01 339
每个页面设置相同标题 index.html 直接修改title标签里面的标题 (ps: 这个html文件中也可以引入一些js文件) 每个页面设置不同标题 public-index.html <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="pragma" content="
Vue设置浏览器小图标（ICON）
Sophia的博客
11-03 7947
Vue设置浏览器小图标及静态标题
vue项目中设置浏览器图标
Frankenstein_的博客
02-28 3996
如何设置项目运行时在浏览器网页窗口中图标的显示，请如下操作： 通过看vue项目的目录结构，根目录下有一个index.html，这个就相当于我们普通项目中的各个html页面文件，所以设置方法就是在index.html的head标签中添加link标签。 这里要注意的是图标文件的位置，不能放到src里，这样的路径会让浏览器找不到。网页把根域名作为相对路径的根目录了，然而我们文件的路径是相对于项目...
vue 设置浏览器的图标（图文教程）
全村的希望的博客
05-02 2118
看看目录结构 注意public 下也有index.html文件，我们是改根文件 下的 index.html。 图片一类的静态文件，放在这个static文件夹下，这个文件夹下的文件（夹）会按照原本的结构放在网站根目录下。这时我们再去使用/static绝对路径，这样就可以访问这些静态文件了。所以推荐将项目中的静态文件放到static文件夹下，这里把public 里面的ico文件拷贝一份到static 往index.html的head 标签加入以下代码 <link rel="short
vue设置浏览器ico图标
最新发布
fakuangjingling的博客
12-20 1885
【代码】vue设置浏览器icon图标。
vue项目设置浏览器标题图标
程序员一枚，仅记录工作中的难点
03-31 567
【代码】vue项目设置浏览器标题图标。
vue项目设置浏览器页签图标icon
热门推荐
qq_43592064的博客
11-07 1万+
vue项目设置浏览器页签图标icon
怎么修改vue项目图标和标题
09-16
要修改Vue项目的图标和标题，可以按照以下步骤进行操作： 1. 修改图标：首先需要找到一个想要作为项目图标的图片，并确保其格式是合适的，比如一个.ico或者.png格式的图标文件。接着，将这个文件复制到Vue项目的`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值