基于flask让图标显示在浏览器的标签中（例3-10）

对应《Flask Web开发:基于Python的Web应用开发实战》

P30 例3-10

hello.py

#-*- encoding:utf-8 -*-
import sys
reload(sys)
sys.setdefaultencoding('utf-8')
from flask import Flask,render_template
from flask.ext.bootstrap import Bootstrap
app=Flask(__name__)
bootstrap=Bootstrap(app)
@app.route('/test')
def index():return render_template('base.html')
if __name__ == '__main__':app.run(debug=True,host='127.0.0.1',port=5002)

自己找个.ico文件放在static文件夹中

templates文件夹中放base.html,用的作者的github上的

{% extends "bootstrap/base.html" %}{% block title %}Flasky{% endblock %}{% block head %}
{{ super() }}
<link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
<link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
{% endblock %}{% block navbar %}
<div class="navbar navbar-inverse" role="navigation"><div class="container"><div class="navbar-header"><button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="/">Flasky</a></div><div class="navbar-collapse collapse"><ul class="nav navbar-nav"><li><a href="/">Home</a></li></ul></div></div>
</div>
{% endblock %}{% block content %}
<div class="container">{% block page_content %}{% endblock %}
</div>
{% endblock %}

总体而言，各个文件的放置结构如下：

最终运行效果如下：

所以静态文件.ico就是为了最终打开浏览器的时候，标签栏上有个小图片，然后书上却翻译成：

这个图标会显示在浏览器的地址栏中。

基于flask让图标显示在浏览器的标签中（例3-10）相关推荐

html网页显示蒙文,网页标签中显示蒙古文竖排文本
网页标签中显示蒙古文竖排文本蒙古文网页和我们经常见到的网页最大的区别在于,在网页中蒙古文文本的显示和编辑不同于其他的网站,蒙古文是竖排文本,并且不像汉文是从左向右书写文字,从上到下换行.而蒙古文是从 ...
关于浏览器meta标签
W3School say meta 标签提供关于HTML文档的元数据.元数据不会显示在页面上,但是对于机器是可读的.它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服 ...
html safari图片不显示,html - 某些FA图标显示在FF，Chrome和Safari中，但没有浏览器会全部显示它们 - 堆栈内存溢出...
我正在使用Pixelarity( https://pixelarity.com/ethereal )的模板,其中他们实现了超赞的v4字体. 由于我也想使用"品牌",因此我需要连接v ...
浏览器访问网站标签页小图标显示
浏览器访问网站标签页小图标显示 1.对于IE浏览器:把需要显示的16x16像素的ICO图标命名为favicon.ICO放置在网站根目录下,浏览器会自动检索 2.对于其他浏览器通用的在标签页加入指定图标 ...
在浏览器的标签页显示网站标志图标
一.在浏览器的标签页显示网站标志图标我们通常希望将浏览器里的Tab选项卡的图标换成自己网站的logo图片,这样看起来更真实和有信任感,可以在<head></head>中添加l ...
电脑如何设置桌面应用图标、图标大小、浏览器网页显示大小
1.桌面应用图标大小单击桌面空白处,右键 ☞ 查看 ☞ 任意切换大图标.中等图标.小图标特点:关机重启后失效,再次开机时恢复到默认图标大小 2.浏览器网页.文字大小 Ctrl+鼠标滚动自由缩放当 ...
如何使网站图标Icon显示在浏览器地址http的前面？
1.第一步,准备一个图标制作软件. 首先您必须了解所谓的图标(Icon)是一种特殊的图形文件格式,它是以.ico 作为扩展名.普通的图像设计软件无法使用这种格式,所以您需要到下载一个ico图标工具,本 ...
webstorm 显示在浏览器打开图标
webstorm 显示在浏览器打开图标在html文件中 ALT + F2 选择即可如果没有显示 settings - > tools -> Web Browsers 一定要点击右下 ...
如何使网站图标Icon显示在浏览器地址前面
概要:首先要了解浏览器到底是如何识别icon图像,并将其显示在浏览器网址框前面的.浏览器有两种识别形式:1.使用link标签形式2.浏览器自动识别首先要了解浏览器到底是如何识别icon图像,并将其显 ...

基于flask让图标显示在浏览器的标签中（例3-10）

基于flask让图标显示在浏览器的标签中（例3-10）相关推荐

最新文章

热门文章