Django中冲突Bootstrap和管理css

我使用Bootstrap与Django，以及从管理员（为日期小部件）的css。我的问题是，在我有日期部件的页面上，管理员的CSS会覆盖引导CSS，因此整个页面看起来不一样。我该如何解决这个问题？Django中冲突Bootstrap和管理css

base.html文件

<head> 

    {% block extra_head %} 
    {% endblock %} 

    <link href="{{ STATIC_URL }}bootstrap/css/bootstrap.css" rel="stylesheet" media="screen"> 

    <link href="{{ STATIC_URL }}bootstrap/css/bootstrap-responsive.css" rel="stylesheet"> 

</head>

模板与日期控件，里面{% block extra_head %}{% endblock %}

{% extends "base.html" %} 
{% load adminmedia %} 

{% block extra_head %} 

    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}admin/css/base.css"/> 
    <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}admin/css/widgets.css"/> 

    <script type="text/javascript" src="/admin/jsi18n/"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/core.js"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/admin/RelatedObjectLookups.js"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.js"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.init.js"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/actions.js"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/calendar.js"></script> 
    <script type="text/javascript" src="{{ STATIC_URL }}admin/js/admin/DateTimeShortcuts.js"></script> 

    <script type="text/javascript">window.__admin_media_prefix__ = "{% filter escapejs %}{% admin_media_prefix %}{% endfilter %}";</script> 

{% endblock %}

来源

2013-03-14 ana

认沽引导CSS。不要担心，只要你没有拨打{{block.super}}，bootstrap就不会被激活。

<head> 
    {% block extra_head %} 
    <link href="{{ STATIC_URL }}bootstrap/css/bootstrap.css" rel="stylesheet" media="screen"> 
    <link href="{{ STATIC_URL }}bootstrap/css/bootstrap-responsive.css" rel="stylesheet"> 
    {% endblock %} 
</head>

要激活其他模板bootsrap，只是简单地说{{block.super}}：

{% extends "base.html" %} 

{% block extra_head %} 
    {{block.super}} 
    //other css here 
{% endblock %}

UPDATE：

要覆盖管理现有的CSS。在你的引导CSS，你必须把!important，这样它会迫使你的模板遵循引导设计

样品：

<p>This red text <strong style="color: red;">should be blue</strong></p> 

<style> 
    strong { color: blue !important; } 
</style>

来源

2013-03-14 14:00:01 catherine

自举被激活，但问题是，管理CSS将覆盖字体等我想引导CSS重写管理CSS的样式。 – ana 2013-03-14 14:11:57

您需要将'！important'放在CSS boottstrap中，这样它会强制它遵循bootstrap设计 – catherine 2013-03-14 14:17:10

Django中冲突Bootstrap和管理css

回答

相关问题