简体   繁体   English

Flask Jinja2模板未渲染样式标签?

[英]Flask Jinja2 template is not rendering style tag?

I am making (learning) a simple web app using flask. 我正在使用flask开发(学习)一个简单的Web应用程序。 I am not using the templates for css input. 我没有将模板用于CSS输入。 I'm directly coding the css using the 'style' tag in the jinja2 template. 我直接使用jinja2模板中的'style'标签对CSS进行编码。 But the style tag is not working. 但是样式标签不起作用。 Even though using inspect element in chrome i can see the style tag being rendered? 即使在chrome中使用inspect元素,我也可以看到正在渲染的样式标签?

index.html code, which is to be rendered index.html代码,将其呈现

{% extends "base.html" %}

{% block style %}
body{
line-height:1.5;
background-color:gray;
font-size:10px;
}   

{% endblock %}

base.html base.html

<html>
<head>

{% if title %}
<title>{{ title }}</title>
{% else %}
<title>Welcome to Micro-blogger Index page!</title>
{% endif %}

<style>
{% block style %}{% endblock %}
</style>
</head>

<body>
<h1><a href='/'>Index</a>
<br/>
{% block content %}{% endblock %}
</body>
</html>

Edit: By not working i mean like the background color is still white and font size & line-height are not as coded. 编辑:不工作,我的意思是像背景颜色仍然是白色,字体大小和行高不是编码的。

Edit:When I put the css element in the base.html , the rendering works. 编辑:当我将css元素放入base.html时,呈现工作。 But when i pass it through variable in the index.html file the prev. 但是,当我通过index.html文件中的变量将其传递时。 mentioned thing happens. 提到的事情发生了。 Yeah i could link a stylesheet or pass the css element from the base.html template , but what would i do in a scenario (i hope i don't have to , maybe for debug purposes) when i have two html docs both inheriting from same base.html but need to have different css attributes (like different background color etc.) 是的,我可以链接样式表或从base.html模板传递css元素,但是当我有两个html文档都继承自html时,该怎么办(我希望我不必这样做,也许出于调试目的)相同的base.html,但需要具有不同的CSS属性(例如不同的背景色等)

What is the need to add style using the ninja template custom tags. 使用忍者模板自定义标签需要添加样式。 Instead you can directly use the style tag. 相反,您可以直接使用样式标签。 Here is the code. 这是代码。

<style>
body{
line-height:1.5;
background-color:gray;
font-size:10px;
}  
</style>

and you can directly place it wherever you want. 您可以直接将其放置在任何位置。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM