HTML5中在title标题标签里设置小图标的方法


Posted in HTML / CSS onJune 23, 2020

一张网页,如果标题只有文字,那会显得特别单调;那么如何加入一个小图标呢,废话不说,代码展示。

在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 之类的像素加色深的图标格式。

效果如下所示:

HTML5中在title标题标签里设置小图标的方法

到此这篇关于HTML5中在title标题标签里设置小图标的方法的文章就介绍到这了,更多相关HTML5标题里设置小图标内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS3轻松实现清新 Loading 效果的简单实例
Jun 06 HTML / CSS
纯HTML5+CSS3制作图片旋转
Jan 12 HTML / CSS
CSS3中各种颜色属性的使用教程
May 17 HTML / CSS
Css3新特性应用之视觉效果实例
Dec 12 HTML / CSS
css3实现蒙版弹幕功能
Jun 18 HTML / CSS
HTML5 video视频字幕的使用和制作方法
May 03 HTML / CSS
HTML5 Canvas基本线条绘制的实例教程
Mar 17 HTML / CSS
关于HTML5语义标签的实践(blog页面)
Jul 12 HTML / CSS
浅谈HTML5中dialog元素尝鲜
Oct 15 HTML / CSS
html2canvas生成清晰的图片实现打印的示例代码
Sep 30 HTML / CSS
H5离线存储Manifest原理及使用
Apr 28 HTML / CSS
CSS实现两列布局的N种方法
Aug 02 HTML / CSS
Canvas 文本填充线性渐变的使用详解
Jun 22 #HTML / CSS
HTML5播放实现rtmp流直播
Jun 16 #HTML / CSS
HTML5实现应用程序缓存(Application Cache)
Jun 16 #HTML / CSS
html5实现九宫格抽奖可固定抽中某项奖品
Jun 15 #HTML / CSS
HTML5页面无缝闪开的问题及解决方案
Jun 11 #HTML / CSS
Html5导航栏吸顶方案原理与对比实现
Jun 10 #HTML / CSS
浅析图片上传及canvas压缩的流程
Jun 10 #HTML / CSS
You might like
让这部DC动画新作刷新你的认知
2020/03/03 欧美动漫
短波问题解答
2021/02/28 无线电
PHP中new static()与new self()的区别异同分析
2014/08/22 PHP
给ECShop添加最新评论
2015/01/07 PHP
微信公众平台开发实现2048游戏的方法
2015/04/15 PHP
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
2011/09/19 Javascript
javascript算法题 求任意一个1-9位不重复的N位数在该组合中的大小排列序号
2012/07/21 Javascript
JavaScript中window、doucment、body的解释
2013/08/14 Javascript
JavaScript程序员应该知道的45个实用技巧
2014/03/04 Javascript
jQuery图片前后对比插件beforeAfter用法示例【附demo源码下载】
2016/09/20 Javascript
全面解析Node.js 8 重要功能和修复
2017/06/02 Javascript
详细分析JS函数去抖和节流
2017/12/05 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
2017/12/06 Javascript
Javascript中parseInt的正确使用方式
2018/10/17 Javascript
js replace替换字符串同时替换多个方法
2018/11/27 Javascript
详解vue 自定义组件使用v-model 及探究其中原理
2019/10/11 Javascript
Vue组件生命周期运行原理解析
2020/11/25 Vue.js
[50:34]VGJ.T vs Fnatic 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
requests和lxml实现爬虫的方法
2017/06/11 Python
django创建自定义模板处理器的实例详解
2017/08/14 Python
Python异常处理操作实例详解
2018/05/10 Python
python实现画五角星和螺旋线的示例
2019/01/20 Python
Python异常继承关系和自定义异常实现代码实例
2020/02/20 Python
python3中datetime库,time库以及pandas中的时间函数区别与详解
2020/04/16 Python
pandas将list数据拆分成行或列的实现
2020/12/13 Python
XD健身器材:Kevlar球、Crossfit健身球
2019/03/26 全球购物
物业管理应届生求职信
2013/10/28 职场文书
如何写一份好的英文求职信
2014/03/19 职场文书
残疾人小组计划书
2014/04/27 职场文书
雷锋精神演讲稿
2014/05/13 职场文书
中学教师暑期培训方案
2014/08/27 职场文书
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
幼儿园感恩节活动方案2014
2014/10/11 职场文书
讲座开场白台词和结束语
2015/05/29 职场文书
HTML+CSS+JS实现图片的瀑布流布局的示例代码
2021/04/22 HTML / CSS
Python如何利用pandas读取csv数据并绘图
2022/07/07 Python