ivew 网站导航地址栏小图标设置

今天药忘吃喽~ 2023-10-18 13:54 135阅读 0赞

最近，接到一个需求要在导航地址栏前面加上一个小图标。作为一个资深后端开发，听到这个要我做整个人都不好了。但弄出来还是很简单的。效果如下：

![20190118165134258.png][]

步骤1：弄一个图标先；

![20190118165337186.png][]

步骤2：在index.html页面里面添加一个标签

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1MjczMDA5_size_16_color_FFFFFF_t_70][]

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

步骤3：可以在build/webpack.dev.conf.js中进行配置favicon属性

![20190118170334215.png][]

new HtmlWebpackPlugin({
                filename: '../index.html',
                template: '../index.html',
                inject: false,
                favicon: './facicon.ico'
            })

步骤4：重新运行下，网页上就出来啦！！！

[20190118165134258.png]: https://img-blog.csdnimg.cn/20190118165134258.png
[20190118165337186.png]: https://img-blog.csdnimg.cn/20190118165337186.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1MjczMDA5_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20190118165510897.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1MjczMDA5,size_16,color_FFFFFF,t_70
[20190118170334215.png]: https://img-blog.csdnimg.cn/20190118170334215.png

发表评论取消回复

表情：

评论列表（有 0 条评论，135人围观）

还没有评论，来说两句吧...

相关阅读

相关 Android 导航栏状态栏设置

<resources> <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionB

柔光的暖阳◎/ 2024年04月08日 08:21/ 0 赞/ 86 阅读

相关 ivew 网站导航地址栏小图标设置

最近，接到一个需求要在导航地址栏前面加上一个小图标。作为一个资深后端开发，听到这个要我做整个人都不好了。但弄出来还是很简单的。效果如下： ![2019011816513425

今天药忘吃喽~/ 2023年10月18日 13:54/ 0 赞/ 136 阅读

相关 html地址栏添加icon小图标

<link rel="shortcut icon" href="img/1.jpg" type="image/x-icon" /> ![20200119091344

冷不防/ 2023年07月01日 04:25/ 0 赞/ 20 阅读

相关微信小程序navigationBarTitleText导航栏标题设置

微信小程序navigationBarTitleText导航栏标题设置全局设置 app.json "window": { "naviga

傷城~/ 2022年12月17日 03:28/ 0 赞/ 236 阅读

相关微信小程序设置底部导航栏

一、概述微信小程序底部想要有一个漂亮的导航栏目，不知道怎么制作，于是百度找到了本篇文章，分享给大家。好了小程序的头部标题设置好了，我们来说说底部导航栏是如何实现

傷城~/ 2022年10月14日 00:46/ 0 赞/ 339 阅读

相关 Bootstrap之网站导航栏制作

网站导航栏制作通过bootstrap变得十分简单。只需要引入相关的样式文件和js文件即可。第一步引入相关文件： <!-- 新 Bootstrap 核心 CSS 文

今天药忘吃喽~/ 2022年09月23日 08:27/ 0 赞/ 236 阅读

相关浏览器地址栏和标题栏显示的小图标

ICO图标的制作第一步，简单的ICO图标只需要一张图片，JPG、PNG、GIF都可以。可以用GIF就意味着你还可以做个有动画效果的高级图标O(∩\_∩)O，不过

àì夳堔傛蜴生んèń/ 2022年06月17日 06:44/ 0 赞/ 286 阅读

相关微信小程序快速设置底部导航栏

效果图 ![在这里插入图片描述][20190111154238218.png] 下面直接上代码吧 1：找到项目根目录中的配置文件 app.json 加入如下配置信

喜欢ヅ旅行/ 2022年03月27日 01:08/ 0 赞/ 553 阅读

相关 IOS 导航栏属性设置

IOS 7 以上系统导航栏： [[UINavigationBar appearance] setTintColor:[UIColor whiteColor]]; //

柔情只为你懂/ 2021年12月11日 11:21/ 0 赞/ 287 阅读

相关微信小程序动态设置导航栏

api->界面->导航栏（1）在页面渲染生命周期函数onReady中使用 wx.setNavigationBarTitle({}

野性酷女/ 2021年07月24日 21:27/ 0 赞/ 566 阅读