>  기사  >  웹 프론트엔드  >  Symfony 2 프로젝트 내에서 CSS 파일의 이미지를 어떻게 참조합니까?

Symfony 2 프로젝트 내에서 CSS 파일의 이미지를 어떻게 참조합니까?

Barbara Streisand
Barbara Streisand원래의
2024-11-17 21:26:02506검색

How do you reference images in CSS files within a Symfony 2 project?

Symfony 2에서 CSS 파일의 이미지 경로 탐색

문제:

이미지 경로가 포함된 CSS 파일이 있습니다. 글꼴 및 기타 자산. 파일 구조는 다음과 같습니다.

...
+-src/
| +-MyCompany/
|   +-MyBundle/
|     +-Resources/
|       +-assets/
|         +-css/
|           +-stylesheets...
+-web/
| +-images/
|   +-images...
...

스타일시트에서 이미지를 참조하고 싶지만 다양한 솔루션에 문제가 있는 것으로 나타났습니다.

수정된 솔루션:

1. "공개" 및 "개인" 디렉토리로 분할:

원본 CSS 파일을 개인 디렉토리(예: src/Common/DirtyBundle/Resources/assets/css)에 저장하세요. Assetic:dump를 실행하기 전에 이러한 파일을 공용 디렉터리에 복사하세요(예: web/bundles/commondirty/css_original).

2. 자산 "cssrewrite" 필터 사용(선택 사항):

이 필터는 꼭 필요한 것은 아니지만 경로 조작을 단순화할 수 있습니다. 사용하는 경우 구문을 적절하게 조정하세요.

3. Twig와 통합:

Twig 템플릿에서 적절한 디렉터리와 필터를 사용하여 CSS 파일을 참조하세요.

{% stylesheets 'bundles/commondirty/css_original/container.css' filter="cssrewrite" %}
    <link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}

{% stylesheets '@CommonDirtyBundle/Resources/assets/css/k.css' filter="cssrewrite" %}
    <link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}

4. 이미지 경로 처리:

구성에 따라 이미지를 참조하기 위해 상대 또는 절대 경로를 사용합니다. 예:

  • 상대 경로: url("../bundles/commondirty/images/devil.png")
  • 절대 경로: url("/bundles/commondirty/images /devil.png")

5. 유지 관리:

assetic:dump를 사용하여 결합된 CSS 파일을 생성한 후 원하는 경우 공용 디렉터리에서 원본 CSS 파일을 삭제할 수 있습니다.

6. 나머지 제약 조건:

  • 액세스하려면 이미지를 공용 디렉터리(예: web/bundles/commondirty/images)에 저장해야 합니다.
  • asset() 함수는 더 이상 개인 디렉토리의 원본 자산에 대해 작동하지 않습니다.

위 내용은 Symfony 2 프로젝트 내에서 CSS 파일의 이미지를 어떻게 참조합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.