51

静的画像を参照する CSS ファイル内に参照があります。

#logo
{
  background: url('/static/logo.png')
}

URL は static.mydomain.com/logo.png である必要があるため、これは私の開発マシンでは問題なく機能しますが、実稼働環境では機能しません。設定ファイルの STATIC_URL に従って css ファイルを動的に変更するにはどうすればよいですか?

4

9 に答える 9

43

相対パスを使用してください。css ファイルが存在するフォルダーに相対的

于 2011-05-05T13:55:01.027 に答える
23

静的ファイル パスを含む CSS は、テンプレートに含まれるインライン CSS に移動できます。

すなわち

<div style="background: url('{% static 'logo.png' %}')"></div>

ここでの問題は、@media クエリでは機能しないことです。これらをブロックに入れる必要があります。

<style>
    @media (min-width: 1200px){
       background: url('{% static 'logo.png' %}');
    }
</style>
于 2016-07-11T23:01:31.583 に答える
15

CSS ファイルでタグを使用する場合{% static %}は、{% include %} タグを使用する必要があります。これを行う例を次に示します。

foo.html

{% load static %}
{% load i18n %}
{% load widget_tweaks %}

<!DOCTYPE html>
<html>
<head>
    <style>
        {% include "path/to/custom_styles_1.css" %}
    </style>
    <link rel="stylesheet" href="{% static 'css/custom_styles_2.css' %}">
</head>
<body>
<!-- Your HTML body -->
</body>
</html>

custom_styles_1.css

{% load static%}

{
     background: url('{% static "/img/logo.png" %}')
}

custom_styles_2.css

.fa {
    position: relative;
    text-align: center;
    font-family: BTitrBold;
    font-size: 3.5em;
}

.name {
    position: absolute;
    top: 37%;
    right: 15%;
}

.school {
    position: absolute;
    top: 530px;
    right: 200px;
}

.id {
    position: absolute;
    top: 700px;
    right: 200px;
}

.degree {
    position: absolute;
    top: 740px;
    left: 195px;
}

custom_styles_1.css{% static %}タグを含むCSSファイルです。タグを使用して foo.html ファイルと統合する必要があります{% include %}。このようにして、Django は必要なすべてのスタイルを適切な場所に配置し、静的タグを正しくレンダリングします。

custom_styles_2.cssはディレクトリ配下の通常のCSSファイルなので、 tagをSTATIC_ROOT使っても問題ありません。{% static %}

于 2018-06-24T13:54:18.807 に答える
5

この同様のスタックオーバーフローの質問を参照してください。

必要なことを行う唯一の方法は、Django を使用して CSS を生成することです。HTML は通常、Django のビューとテンプレートに関連付けられていますが、実際には、CSS、JavaScript、プレーン テキストなど、任意のファイル タイプを返すことができます。ただし、そうするとサイトのオーバーヘッドが増えるため、適切な HTTP ヘッダーとサーバー サイドを設定します生成されたファイルのキャッシュは非常に重要です。

基本的な方法:

return render_to_response('stylesheet.css',
    { 'domain': 'http://static.mydomain.com/' },
    context_instance=RequestContext(request),
    mimetype='text/css'
)

または、開発目的で静的ドメインを localhost にマップするホストをシステムにセットアップすることもできます。その後、通常どおりドメインを参照できますが、開発ファイルから引き続きプルされます。また、システムに Ruby がインストールされている場合は、Ghost と呼ばれる ruby​​gem を利用できます。コマンドラインからカスタムホストを簡単に作成、有効化、無効化、削除できます。

于 2011-05-05T15:01:56.910 に答える
3

django で CSS ファイルをテンプレートのように扱う方法があるかもしれませんが (私は django にあまり詳しくありません)、代わりに別の解決策を試してみることをお勧めします: LESSSassなどの動的スタイルシート言語を使用します。LESS を使用すると、次のように簡単になります。

@base: "//static.example.com/"

#logo {
    background: url(%("%s/logo.png", @base))
}
于 2011-05-05T14:01:29.320 に答える