Django中的引导和管理css冲突_Css_Django_Twitter Bootstrap_Django Admin

Django中的引导和管理css冲突

css django twitter-bootstrap

Django中的引导和管理css冲突,css,django,twitter-bootstrap,django-admin,Css,Django,Twitter Bootstrap,Django Admin,我正在使用Django的引导，以及来自管理员的css（用于日期小部件）。我的问题是，在我有日期小部件的页面上，管理css覆盖引导css，因此整个页面看起来不同。我怎样才能解决这个问题 base.html <head> {% block extra_head %} {% endblock %} <link href="{{ STATIC_URL }}bootstrap/css/bootstrap.css" rel="stylesheet" medi

我正在使用Django的引导，以及来自管理员的css（用于日期小部件）。我的问题是，在我有日期小部件的页面上，管理css覆盖引导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 %}

{%extends“base.html”%}
{%load adminmedia%}
{%block extra_head%}
窗口。\uuuuu admin\u media\u prefix\uuuuu=“{%filter escapejs%}{%admin\u media\u prefix%}{%endfilter%}”；
{%endblock%}

将引导css放入

{%block extra\u head%}{%endblock%}

。不要担心，只要你没有调用

{{block.super}}

，引导程序就不会被激活

<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>

更新：

覆盖现有css的管理。在引导css中，必须放入

！重要信息

，以便强制模板遵循引导设计

样本：

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

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

此红色文本应为蓝色
强{颜色：蓝色！重要；}

引导已激活，但问题是管理员css覆盖字体等。我希望引导css覆盖管理员css中的样式。您需要放置

！重要信息

在css bootstrap中，以便强制它遵循引导设计

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

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