웹 애플리케이션에서 CSS 파일의 상대 경로를 올바르게 지정하는 방법은 무엇입니까?

CSS 파일의 상대 경로를 지정하는 방법

CSS 파일을 웹 애플리케이션으로 가져올 때 올바른 경로를 지정하는 것이 중요합니다. 상대 경로. 귀하의 경우 HTML 페이지는 localhost:8080/ServletApp/index.html에 있으며 이는 프로젝트 루트가 "/ServletApp"임을 나타냅니다.

절대 경로와 상대 경로

• 절대: 앞에 슬래시를 사용합니다. (/)는 호스트 이름의 루트를 나타냅니다(예: "/css/styles.css")
• 상대: 파일이 동일한 위치에 있다고 가정하면 앞에 슬래시를 사용하지 않습니다. 디렉토리를 HTML 페이지로 사용합니다(예: "css/styles.css")

특정 시나리오

프로젝트 구조와 원하는 URL에 따라 CSS import 문에 대한 두 가지 옵션이 있습니다. :

• 옵션 1(절대) 경로):

<link rel="stylesheet" type="text/css" href="/ServletApp/css/styles.css">

이 방법은 더 구체적이며 다른 파일의 위치에 관계없이 파일이 올바르게 참조되도록 보장합니다. 그러나 URL의 "/ServletApp" 부분을 제거하려는 경우 CSS 가져오기를 업데이트해야 합니다.

• 옵션 2(상대 경로):

<link rel="stylesheet" type="text/css" href="css/styles.css">

이 옵션은 CSS 파일이 항상 HTML 페이지와 동일한 디렉토리에 있다고 가정합니다. 더 짧고 깔끔한 접근 방식이지만 파일을 이 특정 위치에 보관해야 합니다. 또한 URL의 "/ServletApp" 부분을 제거하기로 결정한 경우에도 이 가져오기 문은 의도한 대로 작동합니다.

위 내용은 웹 애플리케이션에서 CSS 파일의 상대 경로를 올바르게 지정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!