目录

  • 效果图如下
  • 一.添加标题
  • 1.原生html添加方法
  • 2.vue添加方法
  • 二.网页前面的小图标
  • 1.原生html添加方法pc端和移动端同时添加html里面
    • (1).pc端如下
    • (2).移动端如下
  • 2.vue添加方法和上面添加标题一样

效果图如下

一.添加标题

1.原生html添加方法

head标签里面添加<title>小鸟</title>

2.vue添加方法

打开项目文件夹,在目录里面找到public文件,再打开找到index.html放到编译器vscode里面,添加标题,和原生方法一样

二.网页前面的小图标

1.原生html添加方法pc端和移动端同时添加html里面

也可以使用本地图标,现在用的线上图标

(1).pc端如下

<link href="https://uploads-ssl.webflow.com/624181072db315237608dddf/624602e7174c0d34449163d4_Frame%2044%20copy.png"rel="shortcut icon" type="image/x-icon" />

(2).移动端如下

  <link href="https://uploads-ssl.webflow.com/624181072db315237608dddf/624602b0a1398304c2f7bdb4_Frame%2044.png"rel="apple-touch-icon" />

更具体的手机图标大小

<link rel="apple-touch-icon" sizes="57x57" href="touch-icon-iphone.png" /><link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" /><link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone4.png" /><link rel="apple-touch-icon" sizes="144x144" href="apple-touch-icon-ipad3-144.png" />

2.vue添加方法和上面添加标题一样

感觉文章好的话记得点个心心和关注和收藏,有错的地方麻烦指正一下,如果需要转载,请标明出处,多谢!!!

前端给网页添加标题和前面的小图标原生html和vue项目相关推荐

  1. 微信分享自定义:标题、内容、小图标

    注意:实现此功能需要做的准备工作. (1:):准备一个认证过的微信公众号. (2):登录微信公众后台配置ip白名单,添加域名. (3):获取公众号的app_id和app_secret 1. 在要分享的 ...

  2. 给网页添加网站的logo(icon图标)

    每个网站,都有自己的logo,除了放在网站的显眼位置外,在网页最上方,也是需要logo图标的.比如csdn的: 这个图标,一般是16*16px的icon图,在网页中引入的时候,只需在HTML的titl ...

  3. 项目添加到服务器报错,基于github+travis自动部署vue项目到远端服务器

    前期准备 github账号一个 一个vue的项目 一台linux服务器 travis中添加项目 travis是基于github的,所有只有github的账号可以登录travis,开发者必须有一个git ...

  4. typecho图标_Typecho微信自定义分享插件WeChatShare 自定义标题描述小图标

    前言 张小龙带领微信走进了大众的生活,在十亿用户的生活里扎根.于是我们不管是阅读.聊天.看视频,基本上都离不开微信.好东西分享给用户,第一时间想到的肯定是微信. 很久以前,一个网页分享到微信聊天,系统 ...

  5. 【电子杂志怎么制作】云展网教程 | 如何修改云展网杂志和书橱在微信显示的标题、小图标和描述?

    云展网杂志和书橱都可以通过微信分享给朋友或者分享到朋友圈.下面我们对分享的标题.名称.小图标等内容进行说明: 1.杂志的标题和描述可以在编辑杂志的标题和描述修改: 2.小图标修改.在个人中心–我的文件 ...

  6. 后台管理系统-前端Vue项目搭建

    后台管理系统简介 从本章节开始我们将逐渐完成一套后台管理系统的搭建过程. 前端技术 Vue3.2 , 后端搭建使用Spring Cloud Alibaba. 1.Vue项目初始化 我们使用Vue ui ...

  7. 如何给网页标题添加icon小图标

    今天给大家分享的是如何在网页标题中加入小图标,就像CSDN前面那个红色的C一样. 主要介绍两种方法: 1.在html文件的head部分添加下面代码(注意href的路径). <link rel=& ...

  8. 给网页标题添加icon小图标

    so easy: 给网页标题添加icon小图标: 直接在html文件的head部分添加下面代码(注意href的路径): <link rel="icon" type=" ...

  9. html title中加图标,科技常识:HTML中title前面小图标的实现_如何给网页标题添加icon小图标...

    今天小编跟大家讲解下有关HTML中title前面小图标的实现_如何给网页标题添加icon小图标 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关HTML中title前面小图标的实现_如何给网 ...

最新文章

  1. js blob 下载到本地文件
  2. 精通C++之前,你必须知道的几件事!
  3. Java BufferedReader skip()方法与示例
  4. ABP入门系列(8)——Json格式化
  5. 新冠患者样本单细胞测序文献汇总
  6. RTT的内存管理篇——为什么要进行内存管理?
  7. 手把手教你移植RT-Thread系统
  8. elementUI中登录页form表单重复跳转登陆页
  9. HelloDjango 第 06 篇:博客从“裸奔”到“有皮肤”
  10. 【VerySky原创】怎么查找系统中的锁对象
  11. [ExtJs4.0]数据从excle2003导入到数据库【2-1】
  12. ubuntu-安装qt+gdb-imagewatch
  13. 刷魔趣系统与安装google相机
  14. Win7安装虚拟光驱蓝屏解决办法
  15. 计蒜客T1006对齐输出
  16. 哈尔滨啤酒集团有限公司盈利能力分析毕业设计
  17. b3log-solo 部署到GAE上
  18. java resultset 不关闭_关于ResultSet的关闭问题
  19. H5小游戏——看你有多色
  20. 小白学剪辑从哪里开始 小白学剪辑用什么软件好

热门文章

  1. xlsx如何查找替换_exc-excel里的查找和替换怎么用在excel – 手机爱问
  2. iText5 学习笔记
  3. python中异或是什么意思_python中 “与,或,异或”
  4. std::string 去除前后空格
  5. Android图片底部居中的ImageView
  6. 用计算机唱起了98k,抖音98k歌曲原名叫什么谐音怎么唱 98k歌曲中文谐音歌词
  7. 短视频脚本要注意哪些要素?拍摄场景不能忘,配音也很重要
  8. mybatis in 参数动态拼接
  9. kinova启动异常
  10. python函数的全局、局部名称空间及作用域