L'image d'arrière-plan ne s'affiche pas après l'importation de CSS dans le modèle frontal de symfony2

Question

Après que symfony2 ait géré le CSS, il y a une image d'arrière-plan définie dans le CSS. Symfony2 modifie le chemin du CSS, mais ne modifie pas le chemin de l'image d'arrière-plan définie dans le CSS, ce qui empêche l'affichage de l'image d'arrière-plan. devrais-je? Merci d'avance!

Answer 1

Si vous utilisez Assetic, alors vous devez ajouter le fichier cssrewrite, c'est-à-dire :

{% stylesheets 'bundles/app/css/*' filter='cssrewrite' %}

Que signifie ce filtre ?

Lorsque vous actifs: dump (ou actifs: install), Symfony2 déplacera vos fichiers statiques (CSS) du Bundle vers le répertoire racine Web, donc les chemins de certains fichiers ont changé (comme ceux référencés dans l'image CSS), ainsi provoquant le problème signalé par le sujet.

Le filtre cssrewrite est donc spécifiquement utilisé pour calculer la relation relative entre les CSS et les images, et mettre à jour directement le chemin en CSS.

Laissez-moi vous donner un exemple pratique. Vous avez maintenant deux fichiers logo.png et style.css :

/src/AppBundle/Resources/public/img/logo.png
/src/AppBundle/Resources/public/css/style.css

Vous avez besoin de ../img/logo.png pour référencer logo.png dans style.css, n'est-ce pas ?

Maintenant, lorsque vous actifs: dumpez, le composant Assetic de Symfony2 exportera logo.png et style.css vers le répertoire /web, car /src n'est pas directement accessible, maintenant logo.png et style.css seront exportés dans le nouveau annuaire :

/web/bundles/app/img/logo.png
/web/css/11e4a17.css

Vous verrez que la relation relative entre 11e4a17.css (le fichier après style.css a été renommé) et logo.png a changé L'original ../img/logo.png ne peut plus faire référence à logo.png , la signification. de cssrewrite est qu'il mettra à jour ../img/logo.png dans 11e4a17.css (style.css) vers ../bundles/app/img/logo.png.

C’est tellement long d’en dire autant, j’espère que cela pourra aider celui qui pose la question.

Answer 2

Vous n'avez peut-être pas lu le document, je vous le donne
Comment utiliser Assetic pour la gestion d'actifs