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 position fixed固定居中问题解决方案
Aug 19 HTML / CSS
用CSS3写的模仿iPhone中的返回按钮
Apr 04 HTML / CSS
基于CSS3制作立体效果导航菜单
Jan 12 HTML / CSS
纯CSS3实现8组超炫酷鼠标滑过图片动画
Mar 16 HTML / CSS
CSS3实现彩色进度条动画的示例
Oct 29 HTML / CSS
CSS3制作圆形滚动进度条动画的示例
Nov 05 HTML / CSS
html5 svg 中元素点击事件添加方法
Jan 16 HTML / CSS
整理HTML5移动端开发的常用触摸事件
Apr 15 HTML / CSS
Html5 滚动穿透的方法
May 13 HTML / CSS
amaze ui 的使用详细教程
Aug 19 HTML / CSS
HTML5 新增内容和 API详解
Nov 17 HTML / CSS
HTML中link标签属性的具体用法
May 07 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
thinkphp3.0 模板中函数的使用
2012/11/13 PHP
浅析php中常量,变量的作用域和生存周期
2013/08/10 PHP
使用PHP生成PDF方法详解
2015/01/23 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
Laravel 5.3 学习笔记之 配置
2016/08/28 PHP
PHP字典树(Trie树)定义与实现方法示例
2017/10/09 PHP
php删除二维数组中的重复值方法
2018/03/12 PHP
php curl获取https页面内容,不直接输出返回结果的设置方法
2019/01/15 PHP
PHP设计模式(八)装饰器模式Decorator实例详解【结构型】
2020/05/02 PHP
THINKPHP5.1 Config的配置与获取详解
2020/06/08 PHP
javascript 窗口加载蒙板 内嵌网页内容
2010/11/19 Javascript
jQuery中:last-child选择器用法实例
2014/12/31 Javascript
修改Jquery Dialog 位置的实现方法
2016/08/26 Javascript
AngularJS自定义服务与fliter的混合使用
2016/11/24 Javascript
Bootstrap警告框(Alert)插件使用方法
2017/03/21 Javascript
微信小程序 蓝牙的实现实例代码
2017/06/27 Javascript
vue2.0中vue-cli实现全选、单选计算总价格的实例代码
2017/07/18 Javascript
vue组件Prop传递数据的实现示例
2017/08/17 Javascript
IntersectionObserver实现图片懒加载的示例
2017/09/29 Javascript
Angular 组件之间的交互的示例代码
2018/03/24 Javascript
使用JS代码实现俄罗斯方块游戏
2018/08/03 Javascript
浅谈微信页面入口文件被缓存解决方案
2018/09/29 Javascript
JS实现的tab页切换效果完整示例
2018/12/18 Javascript
微信小程序textarea层级过高的解决方法
2019/03/04 Javascript
详解vue-cli 脚手架 安装
2019/04/16 Javascript
js滚轮事件 js自定义滚动条的实现
2020/01/18 Javascript
JS通过识别id、value值对checkbox设置选中状态
2020/02/19 Javascript
python数据结构之二叉树的统计与转换实例
2014/04/29 Python
Django框架下在URLconf中指定视图缓存的方法
2015/07/23 Python
Python3中关于cookie的创建与保存
2018/10/21 Python
python通过文本在一个图中画多条线的实例
2020/02/21 Python
python时间time模块处理大全
2020/10/25 Python
印尼综合在线预订网站:Tiket.com(机票、酒店、火车、租车和娱乐)
2018/10/11 全球购物
初一科学教学反思
2014/01/27 职场文书
党员批评与自我批评
2014/02/12 职场文书
公安干警正风肃纪心得体会
2016/01/15 职场文书