在没有主机的情况下将收藏夹添加到HTML文件中



我正在尝试将一个favicon添加到HTML文件中。当我在笔记本电脑上本地查看时,图标会起作用,但一旦我将作业上传给教练,图标就不在了。我需要将href属性设置为链接吗?

HTML:

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

您需要在名为favicon_io的文件夹中包含您的收藏夹,并将您的收藏夹命名为favicon.ico

只需将图标放在index.html所在的根文件夹中,然后将href更改为

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

仔细检查favicon链接标记中的href路径,并确保链接标记位于代码的中。

如果这不起作用,请使用Chrome开发工具并打开"网络"选项卡。检查favicon资产是否正确加载到DOM中。

还要仔细检查,以确保最喜欢的图像资产包含在提交给教授的家庭作业中。

请确保在标头中添加您的代码。

<!DOCTYPE html>
<html lang="en">
<head>
<link rel="shortcut icon" type="image/ico" href="favicon_io/favicon.ico">
</head>
<body>
<!-- body content -->
</body>
</html>

导入一个图标来表示文档。

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

您还会遇到许多其他常见类型。例如,链接到该网站的收藏夹:

<link rel="icon" href="favicon.ico">

还有许多其他图标rel值,主要用于指示在各种移动平台上使用的特殊图标类型,例如:

<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-icon-114.png" type="image/png">

HTML外部资源链接元素((指定当前文档和外部资源之间的关系。此元素最常用于链接到样式表,但也是用于建立站点图标("favicon"样式的图标和图标用于主屏幕和移动设备上的应用程序(。

在页眉中添加代码。

<!DOCTYPE html>
<html lang="en">
<head>
<title>Document Title</title>
<link rel="icon" href="favicon.ico">
</head>
<body>
<div></div>
</body>
</html>

链接:外部资源链接元素

最新更新