【Vue】更換瀏覽器默認 logo

更換瀏覽器默認logo為自定義圖片

  • 一. 瀏覽器默認 logo
  • 二. 替換為自定義logo
  • 三. 步驟
    • 3.1 轉換大小
      • 3.1.1 查看圖片尺寸
      • 3.1.2 修改尺寸(為32px 32px)
    • 3.2 替換成功

一. 瀏覽器默認 logo

在這里插入圖片描述

二. 替換為自定義logo

在這里插入圖片描述

三. 步驟

3.1 轉換大小

將自定義 logo 轉為32×32(單位:px) 的圖片(圖片后綴不限)

3.1.1 查看圖片尺寸

非 32px × 32px

3.1.2 修改尺寸(為32px 32px)

  1. 圖片-鼠標右鍵打開屬性框-屬性修改-修改尺寸
    在這里插入圖片描述
  2. 修改尺寸-保存(.ico/.png/jpg/…)
    在這里插入圖片描述
  3. 圖片放于項目

(1)圖片名稱為 favicon.ico

路徑:public下即可
方式:直接替換原 favicon.ico即可

在這里插入圖片描述

(2)圖片名稱為 【非 favicon.ico】

圖片路徑:public下即可
index.html 路徑:public下
圖片名稱和必須 index.html 中 保持一致

在這里插入圖片描述
到這里就可以啦
tip:index.html中有關logo的link標簽,也可以有以下寫法:

 <link rel ="shortcut icon" type="image/x-icon" href="/public/favicon.ico" rel="external nofollow"  rel="external nofollow" >

3.2 替換成功

在這里插入圖片描述

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/713033.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/713033.shtml
英文地址,請注明出處:http://en.pswp.cn/news/713033.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

docker搭建zookeeper集群

文章目錄 1. 集群搭建2. Leader選舉3. Zookeeper集群角色 1. 集群搭建 這里我們使用docker-compose 搭建偽集群 version: 3.1 services:zoo1:image: zookeeperrestart: alwayscontainer_name: zoo1ports:- 2181:2181volumes:- /home/zk/zoo1/data:/data- /home/zk/zoo1/datal…

React富文本編輯器開發(二)

我們接著上一節的示例內容&#xff0c;現在有如下需求&#xff0c;我們希望當我們按下某個按鍵時編輯器有所反應。這就需要我們對編輯器添加事件功能onKeyDown, 我們給 Editor添加事件&#xff1a; SDocor.jsx import { useState } from react; import { createEditor } from…

【LeetCode-178】最長重復子串(動歸)

目錄 LeetCode718.最長重復子串 題目描述 解法1&#xff1a;動態規劃 代碼實現 題目鏈接 題目描述 給兩個整數數組 A 和 B &#xff0c;返回兩個數組中公共的、長度最長的子數組的長度。 示例&#xff1a; 輸入&#xff1a; A: [1,2,3,2,1] B: [3,2,1,4,7] 輸出&…

協方差矩陣計算

文章目錄 協方差矩陣計算原理python實現 協方差矩陣 協方差矩陣反映了兩個隨機變量變化時是同向還是反向的&#xff08;相關性&#xff09;。 如果協方差>0&#xff0c;則說明這兩個隨機變量同向變化。 協方差矩陣<0&#xff0c;則說明是反向變化。 協方差矩陣0&#xf…

【LeetCode】347.前 K 個高頻元素

今日學習的文章鏈接和視頻鏈接 leetcode題目地址&#xff1a;347.前 K 個高頻元素 代碼隨想錄題解地址&#xff1a;代碼隨想錄 題目簡介 給你一個整數數組 nums 和一個整數 k &#xff0c;請你返回其中出現頻率前 k 高的元素。你可以按 任意順序 返回答案。 看到題目的第一…

Python-公共操作與推導式

一、公共操作 運算符 (1)&#xff1a;合并操作符 適用范圍&#xff1a;字符串、列表、元組 (2)*&#xff1a;復制 適用范圍&#xff1a;字符串、列表、元組 (3)in&#xff1a;判斷某字符串存在 (4)not in&#xff1a;判斷某字符串不存在 list1[1,2] list2[3,4] t1(1,2) t2(3,…

手把手教你在 CentOS7 上部署Ngrok (踩坑填坑)

一、項目準備 1、一個可用的域名&#xff08;不是必須&#xff0c;但是最好有&#xff09; 2、一臺有公網IP的服務器 二、項目實施 本文的操作過程主要參考了《教你自己服務器搭建Ngrok》&#xff0c;但是隨著時間的推移&#xff0c;很多軟件因版本升級而產生了一些變化&…

掌握 MySQL 的數據類型

知道了表是由不同數據類型的列組成的&#xff0c;然后填充了一行一行的數據。 當我們要創建表的時候&#xff0c;就要根據業務需求&#xff0c;選擇合適的數據類型。比如在實戰項目中&#xff0c;文章表就是由下面這些不同數據類型的字段定義的。 目前用到了 bigint、tinyint、…

vue3+ts+vite使用mock數據

安裝以下命令 npm i vite-plugin-mock --save-dev npm i mockjs --save-dev 在根路徑下創建mock文件夾 mock\user.ts const menuList [{path: /system,component: Layout,name: system,meta: {title: 系統管理,icon: Setting,roles: [sys:manage]},children: [{path: /depar…

blender 導出bvh x軸旋轉90度

目錄 blender導出模型后&#xff0c;x 軸旋轉了 90 度&#xff0c;和縮放不對的問題 bvh&#xff1a; blender導出模型后&#xff0c;x 軸旋轉了 90 度&#xff0c;和縮放不對的問題 博文解決了fbx格式d軸旋轉90度的問題&#xff0c;bvh的沒有解決 Blender - Export FBX to …

Java中使用poi+poi-tl實現根據模板導出word文檔

場景 若依管理系統前后端分離版基于ElementUI和SpringBoot怎樣實現Excel導入和導出: 若依管理系統前后端分離版基于ElementUI和SpringBoot怎樣實現Excel導入和導出_若依導出前端獲得到后端的execl流之后怎么操作-CSDN博客 上面講的是Excel的導出&#xff0c;如果是需要根據w…

即插即用篇 | YOLOv8 引入 MHSA 注意力機制 | 《Bottleneck Transformers for Visual Recognition》

論文名稱:《Bottleneck Transformers for Visual Recognition》 論文地址:https://arxiv.org/pdf/2101.11605.pdf 文章目錄 1 原理2 源代碼3 添加方式4 模型 yaml 文件template-backbone.yamltemplate-small.yamltemplate-large.yamltemplate-neck.yaml

Mac 重新安裝系統

Mac 重新安裝系統 使用可引導安裝器重新安裝&#xff08;可用于安裝非最新的 Mac OS&#xff0c;系統降級&#xff0c;需要清除所有數據&#xff09; 插入制作好的可引導安裝器&#xff08;U盤或者移動固態硬盤&#xff09;&#xff0c;如何制作可引導安裝器將 Mac 關機將 Ma…

排序——冒泡排序

冒泡排序的基本思想 從前往后&#xff08;或從后往前&#xff09;兩兩比較相鄰元素的值&#xff0c;若為逆序&#xff08;即 A [ i ? 1 ] < A [ i ] A\left [ i-1\right ]<A\left [ i\right ] A[i?1]<A[i]&#xff09;&#xff0c;則交換它們&#xff0c;直到序列…

MySQL慢查詢分析

1. 什么是慢查詢&#xff1f; 在MySQL中&#xff0c;慢查詢定義為執行時間超過特定閾值的查詢。這個閾值可以通過MySQL的配置選項long_query_time來設置。默認情況下&#xff0c;long_query_time的值是10秒&#xff0c;意味著任何執行時間超過10秒的查詢都會被認為是慢查詢。然…

標準PoE交換機、非標準PoE交換機和非PoE交換機三者到底有何區別?

目錄 前言&#xff1a; 一、標準PoE交換機 1.1 工作原理 1.2 應用場景 1、視頻監控 2、無線接入點 3、IP電話 1.3 優勢 1、簡化布線 2、簡化安裝 3、提高可靠性 二、非標準PoE交換機 2.1 工作原理 2.2 應用場景 1、無線路由器 2、IP電話 3、數據中心 2.3 優勢…

c++面試三 -- 智能指針--7000字

一、智能指針 C 中的智能指針是一種用于管理動態分配的內存的對象&#xff0c;它們可以自動進行內存管理&#xff0c;避免內存泄漏和懸掛指針等問題。 1. 懸掛指針 懸掛指針&#xff08;dangling pointer&#xff09;是指在程序中仍然存在但已經不再指向有效內存地址的指針。懸…

IO多路復用 poll模型

poll 是一種在 Linux 系統中進行 I/O 多路復用的模型&#xff0c;它與 select 類似&#xff0c;但具有一些不同之處。poll 允許監視的文件描述符數量不受限制&#xff0c;而不像 select 有一定的限制。 基本概念&#xff1a; poll 函數&#xff1a; 通過 poll 函數&#xff0c…

隊列的結構概念和實現

文章目錄 一、隊列的結構和概念二、隊列的實現三、隊列的實現函數四、隊列的思維導圖 一、隊列的結構和概念 什么是隊列&#xff1f; 隊列就是只允許在一端進行插入數據操作&#xff0c;在另一端進行刪除數據操作的特殊線性表&#xff0c;隊列具有先進先出 如上圖所示&#x…

【比較mybatis、lazy、sqltoy、mybatis-flex操作數據】操作批量新增、分頁查詢(二)

orm框架使用性能比較 環境&#xff1a; idea jdk17 spring boot 3.0.7 mysql 8.0比較mybatis、lazy、sqltoy、mybatis-flex操作數據 測試條件常規對象 orm 框架是否支持xml是否支持 Lambda對比版本mybatis????3.5.4sqltoy????5.2.98lazy????1.2.4-JDK17-SNAPS…