django admin覆盖内联模型的css

时间:2021-08-27 19:18:38

I'm using https://github.com/s-block/django-nested-inline with something like this:

我正在使用https://github.com/s-block/django-nested-inline,如下所示:

class C(NestedStackedInline):
    model = C
    max_num = 1
    fk_name = 'B'

    class Media:
        css = {
             'all': ('/static/admin/css/forms-nested.css',)
        }


class B(NestedStackedInline):
    model = B

    class Media:
        css = {
             'all': ('/static/admin/css/forms-nested2.css',)
        }

    inlines = [C]


class A(NestedModelAdmin):
    model = A
    inlines = [B]

forms-nested.css is:

forms-nested.css是:

.inline-related h3 {
    margin: 0;
    color: #666;
    padding: 3px 5px;
    font-size: 11px;
    background: #e1e1e1 url(../img/nav-bg.gif) top left repeat-x;
    border-bottom: 1px solid #ddd;
}

and forms-nested2.css is:

和forms-nested2.css是:

.inline-related h3 {
    margin: 0;
    color: #484846;
    padding: 3px 5px;
    font-size: 11px;
    background: #D9DBCB;
    border-bottom: 1px solid #ddd;
}

Essentially I'm trying to have model-specific CSS for nested inlines. I want class C (the 2nd level inline) to have different h3 styling to class B (the 1st level inline). However class C's Media seems to override class B.

基本上我正在尝试为嵌套内联提供特定于模型的CSS。我希望C类(第二级内联)对B类(第一级内联)有不同的h3样式。但C级媒体似乎覆盖了B级。

Is there any way to do this ?

有没有办法做到这一点?

Thanks

谢谢

1 个解决方案

#1


1  

It's not like C's media is overriding B's media. They both appear in your admin page, but...

这不像C的媒体正在压倒B的媒体。它们都出现在您的管理页面中,但是......

CSS of C's media is overriting CSS of B's media. Because this is how CSS works. Try to change forms-nested.css to have this:

C媒体的CSS正在压制B媒体的CSS。因为这就是CSS的工作原理。尝试更改forms-nested.css以使其具有:

.inline-related .inline-related h3 {

That will only style nested .inline-related h3.

这只会影响嵌套的.inline相关的h3。

#1


1  

It's not like C's media is overriding B's media. They both appear in your admin page, but...

这不像C的媒体正在压倒B的媒体。它们都出现在您的管理页面中,但是......

CSS of C's media is overriting CSS of B's media. Because this is how CSS works. Try to change forms-nested.css to have this:

C媒体的CSS正在压制B媒体的CSS。因为这就是CSS的工作原理。尝试更改forms-nested.css以使其具有:

.inline-related .inline-related h3 {

That will only style nested .inline-related h3.

这只会影响嵌套的.inline相关的h3。