L'image d'arrière-plan ne s'affiche pas après l'importation de CSS dans le modèle frontal de symfony2
我想大声告诉你
我想大声告诉你 2017-05-16 16:44:10
0
2
655

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!

我想大声告诉你
我想大声告诉你

répondre à tous(2)
淡淡烟草味

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.

刘奇

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

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal