đường dẫn tương đối vào tệp CSS

Question

Tôi có thư mục css ở gốc của Ứng dụng web Java của tôi. Tuyên bố nhập của tôi trông giống như sau:

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

Kiểu này không được áp dụng, vì vậy tôi cho rằng đường dẫn đến thư mục css không được chỉ định chính xác. Làm thế nào để xác định rằng thư mục css nằm ở thư mục gốc của thư mục Project?

thư mục dự án của tôi chứa:

build 
css 
dist 
nbproject 
src 
web 
build.xml 

Các trang html mà tôi đang xem là index.html, và URL hiển thị là localhost: 8080/ServletApp/

Answer 1

nếu tập tin có chứa thẻ liên kết là trong thư mục gốc của dự án, sau đó con đường đúng sẽ là "css/styles.css"

Answer 2

nền

Absolute: Trình duyệt sẽ luôn giải thích / làm thư mục gốc của tên máy chủ. Ví dụ: nếu trang web của tôi là http://google.com/ và tôi đã chỉ định /css/images.css thì nó sẽ tìm kiếm trang đó tại http://google.com/css/images.css. Nếu gốc dự án của bạn thực sự ở số /myproject/, nó sẽ không tìm thấy tệp css. Do đó, bạn cần phải xác định nơi gốc thư mục dự án của bạn có liên quan đến tên máy chủ và chỉ định điều đó trong ký hiệu href của bạn.

tương đối: Nếu bạn muốn tham khảo một cái gì đó mà bạn biết đang cùng một đường dẫn url - có nghĩa là, nếu nó đang ở trong cùng một thư mục, ví dụ http://mysite.com/myUrlPath/index.html và http://mysite.com/myUrlPath/css/style.css, và bạn biết rằng nó sẽ luôn luôn theo cách này là, bạn có thể đi ngược lại quy ước và chỉ định đường dẫn tương đối bằng cách không đặt / hàng đầu ở trước đường dẫn của bạn, ví dụ: css/style.css.

Ký hiệu hệ thống tệp: Ngoài ra, bạn có thể sử dụng ký hiệu hệ thống tệp chuẩn như ... Nếu bạn làm http://google.com/images/../images/../images/myImage.png, nó sẽ giống như http://google.com/images/myImage.png. Nếu bạn muốn tham khảo thứ gì đó là một thư mục từ tệp của bạn, hãy sử dụng ../myFile.css.

---

trường hợp cụ thể của bạn

Trong trường hợp của bạn, bạn có hai lựa chọn:

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

Đầu tiên sẽ cụ thể hơn và tương thích nếu bạn di chuyển mọi thứ xung quanh, tuy nhiên nếu bạn đang có kế hoạch để giữ t anh ta tập tin trong cùng một vị trí, và bạn đang có kế hoạch để loại bỏ/ServletApp/một phần của URL, sau đó giải pháp thứ hai là tốt hơn.

Answer 3

Bạn phải di chuyển thư mục css vào thư mục web của mình. Dường như thư mục web của bạn trên ổ đĩa cứng bằng thư mục /ServletApp được xem từ www.Không thể truy cập nội dung khác ngoài thư mục web của bạn từ trình duyệt.

Url của liên kết CSS là sau đó

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