HTML5页面中如何给title标签添加一个小小的图标
Admin 2022-07-01 群英技术资讯 1097 次浏览
在这篇文章中,我们来学习一下“HTML5页面中如何给title标签添加一个小小的图标”的相关知识,下文有详细的讲解,易于大家学习和理解,有需要的朋友可以借鉴参考,下面就请大家跟着小编的思路一起来学习一下吧。一张网页,如果标题只有文字,那会显得特别单调;那么如何加入一个小图标呢,废话不说,代码展示。
在html中的<head>标签里:
<head> <meta charset="UTF-8"> <title>叮叮书店</title> <link href="images/logo.ico" rel="icon" type="image/x-ico"> <link href="style.css" rel="stylesheet" type="text/css"> </head>
在这里简单说明一下:
但凡遇到自己不熟悉的东西时,其实都可以跟自己之前遇到过的相类比,从而得出它们身上的异同;
我们基本上已经知道CSS3可以引入外部样式表,<img也是通过外部引入的,那么图标也不例外,href=" "不能少,填入图标相对路径;
rel(relation 联系 就是与此html网页有什么联系,是它的什么)=" ",填入图标单词icon; type=" "这个经本人测试,加不加都不影响效果,但是可能对代码的可移植性有影响,所有还是加上比较好,image是图片类型,x-ico是一种图标格式,图标其实是多张相同显示图片的不同尺寸和发色数组合而成,是三维的,所以x-ico是完整格式的缩写,像24x24 32bit、32x32 32bit 之类的像素加色深的图标格式。
效果如下所示:

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
本篇文章给大家带来的内容是关于h5 canvas实现粒子时钟的详细方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
这篇文章主要介绍了css 评分效果的星星示例的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
css实现元素垂直居中显示的方式有哪些?一些朋友可能会遇到这方面的问题,对此在下文小编向大家来讲解一下,内容详细,易于理解,希望大家阅读完这篇能有收获哦,有需要的朋友就往下看吧!
这篇文章主要介绍了详解解决flex布局的justify-content: space-between对齐方式的一个BUG的两种方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
本篇文章带大家了解一下CSS3中的Flex布局,希望对大家有所帮助!
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008