如何将我的SVG徽标添加到我网站的标签栏

发布于 2025-01-22 05:55:13 字数 925 浏览 2 评论 0原文

我有徽标是我的React项目的SVG文件，该文件保存在我的Images文件夹中，我想在浏览器选项卡上使用此SVG图标，我可以使用SVG文件吗？以及如何链接到它，我尝试在index.html文件中的HEAD标签中执行以下操作，但无效。

<head>
    <meta charset="utf-8" />
    <link rel="icon" href="src\images\logo.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <link rel="apple-touch-icon" href="src\images\logo.svg" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <link
      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Mulish:wght@300;400;700&family=Playfair+Display:wght@700&display=swap"
      rel="stylesheet"
    />

    <title>Thousand Sunny Travel Agency</title>
  </head>

原文

I got my logo which is an SVG file for my react project which is saved in my images folder , i wanted to use this SVG icon on my browser tab , am i able to use SVG files ? and how i can link to it , i tried doing the following in the head tag in the index.html file but didnt work .

<head>
    <meta charset="utf-8" />
    <link rel="icon" href="src\images\logo.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <link rel="apple-touch-icon" href="src\images\logo.svg" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
    <link
      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Mulish:wght@300;400;700&family=Playfair+Display:wght@700&display=swap"
      rel="stylesheet"
    />

    <title>Thousand Sunny Travel Agency</title>
  </head>

分享到QQ

分享到微博