Question

        {% extends "base.html" %}
        {% load i18n %}
        {% load staticfiles %}
        {% block jsscript %}
    <!-- Script code -->
            <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
                <script>
                    $(function() {
                        $('#btnNext_picklocation').attr('disabled','disabled');
                        $("#location input[type='checkbox']").click(function(){
                            if($('#location input[type="checkbox"]').is(':checked'))
                            {
                                $('#btnNext_picklocation').removeAttr('disabled');
                            }
                            else
                            {
                                $('#btnNext_picklocation').attr('disabled','disabled');
                            }
                        });
                        $("#location .maps img").attr("src","{% static 'media/loading.gif' %}");
                        $("#location .maps img").error(function(){
                            $(this).unbind("error").attr("src","{% static 'media/loading.gif' %}");
                        });
                        {% for obj in filter_location %}
                        var url{{obj.city}}="http://maps.googleapis.com/maps/api/staticmap?center={{obj.suite}},{{obj.street}},{{obj.city}}&size=400x200&maptype=roadmap&markers=size:mid|color:green|{{obj.suite}},{{obj.city}}&sensor=true";
                        $("#map{{obj.city}}").attr("src",encodeURI(url{{obj.city}}));
                        {% endfor %}
                        $('#btnNext').click(function(){
                            window.location.assign("./pickpaymentplan/");
                        });
                    });
                </script>
            <link rel="stylesheet" href="{% static 'css/base.css' %}" />
        {% endblock %}
        {% block head %}
                <h1 class="heading" >Place An Order</h1>
                <h4 class="heading">Please choose a location</h4>
        {% endblock %}
        {% block content %}
<!-- Main Body Content -->
            <form id="frmLocation" action="./" method="POST">{% csrf_token %}
                    <table border="0">
                        <tr>
                            <td>
                                <table border="1" id="location" >
                                    <tr>
                                        <th>&nbsp;&nbsp;&nbsp;&nbsp;</th>
                                        <th>Locations</th>
                                        <th>Map</th>
                                    </tr>
                                    {% if filter_location %}    
                                    {% for p in filter_location %}
                                    <tr>
                                        <td><input type="checkbox" id="{{p.location_id}}L" name="{{p.location_id}}L" ></td>
                                        <td>{{p.suite}},{{p.street}},<br/>{{p.city}},{{p.state}},<br/>{{p.country}},{{p.zip}}</td>
                                        <td class="maps" ><img id="map{{p.city}}" /></td>
                                    </tr>
                                    {% endfor %}
                                    {% else %}
                                    <tr></tr>
                                    <tr><td  colspan="5">No Locations!</td></tr>
                                    {% endif %}
                                </table></td>
                        </tr>
                        <tr>
                            <td style="text-align:right"><input type="submit" id="btnNext_picklocation" name="btnNext_picklocation" class="btnNext" value="Next"/>              </td>
                        </tr>
                    </table>
                </form>
            </div>
            <div id="footer" name="footer">
            </div>
        {% endblock %}

我这段代码我使用了base.html文件作为基本模板。对settings.py进行了适当的更改，例如static_url，media_url。仍然这个页面没有按预期工作。缩进是一个问题吗？是否有一些额外的步骤可以用来实现css？

Answer 1

我的第一个猜测是你在某些后代模板中覆盖了{% block jsscript %}。如果不是这样，那么我会确认{% static 'css/base.css' %}的输出实际上是在给你你想要的东西（你能访问那个URL吗？）

另外两个想法：

空间在模板中并不重要。
您应该将CSS移到{% block stylesheets %}而不是{% block jsscript %}。

Answer 2

如果您要覆盖模板块，并希望维护该块的原始内容，则可以使用{{block.super}}输出原始内容，如下所示：

parent.html：

<html>
<head>
    <title>{% block title %}MySite{% endblock %}</title>
<body>
    {% block content %}{% endblock %}
</body>
</html>

child.html

{% extends 'parent.html' %}
{% block title %}Child Page - {{block.super}}{% endblock %}
{% block content %}Hello world!{% endblock%}

使用child.html呈现的页面的title将是“Child Page - MySite”

Answer 3

在任何框架中诊断此类问题的一般步骤是：

验证生成的页面中是否存在<link>标记 - 在浏览器中使用“查看页面源”或在Firebug *中使用HTML面板
验证href标记的<link>属性是否正常
使用Firebug的Net面板查看您的样式表是否实际已加载
直接在浏览器的地址栏中输入样式表的URL（在您生成的页面中找到）以查看其实际内容是否符合预期
如果上述所有问题都没有发现，请使用Firebug的CSS面板查看是否有另一个样式表覆盖您的样式。

如果您按照这些步骤进行操作，很可能会自己找到问题，如果没有 - 您将能够提出更具体的问题

“Firebug”的{p> *我的意思是Firebug本身，Chrome Dev Tools或Opera Dragonfly，无论你的口味如何。

CSS无法在Django中工作

3 个答案: