Hình ảnh CSS của tôi không hoạt động trên Windows Azure

Question

Tôi có tình huống thực sự lạ khi hình ảnh CSS không được hiển thị sau khi trang web được triển khai cho Windows Azure.

1. Những hình ảnh này là một phần của dự án (tất cả các file và thư mục con có trong dự án)

2. Tất cả các hình ảnh có một hành động xây dựng của Content

3. Tôi không sử dụng đường dẫn tương đối, luôn sử dụng đường dẫn tuyệt đối trên các chế độ xem/nội dung/đường dẫn/đến/hình ảnh của tôi, nhưng trên CSS có url đường dẫn tương đối (../ img/image.png) nhưng điều này không phải là vấn đề.

4. Tệp tĩnh là OK (CSS và Javascript hoạt động chính xác), ngoại trừ các hình ảnh không hiển thị.

Tôi đã triển khai bằng git, nhưng ngay cả với Trình hướng dẫn xuất bản, tôi cũng nhận được kết quả tương tự.

Hình ảnh ở đó nếu tôi yêu cầu chúng có đường dẫn đầy đủ. Đây là "không thực tế";)

Tôi phải bỏ qua một điều quan trọng ở đây, nhưng không thể tìm thấy nó. Cảm ơn bạn đã dành thời gian.

Chỉnh sửa:

Hình ảnh hoạt động thông qua thẻ img. Vì vậy, chỉ có các hình ảnh CSS, mà không có ý nghĩa, họ đang làm việc một cách chính xác tại địa phương.

Tôi đoán tôi có thể chia sẻ liên kết, vì vậy bạn có thể thấy điều này sống;)

http://receivably.azurewebsites.net

Nhìn vào biểu tượng trên bên trái, không có gì xuất hiện, đây là HTML và CSS (điều này đang làm việc cũng một vài deplyment trước, và hoạt động tốt tại địa phương

<a class="brand" href="/">name</a> 

trong CSS:.

.navbar .brand { 
    display: block; 
    width: 180px; 
    height: 34px; 
    padding-top: 0; 
    padding-bottom: 0; 
    margin-top: 2px; 
    margin-left: 10px; 
    overflow: hidden; 
    font-size: 18px; 
    line-height: 600px; 
    color: #333; 
    background: url(../img/logo.png) no-repeat 0 0; 
} 

Và nếu chúng tôi yêu cầu tệp trực tiếp tại đó: http://receivably.azurewebsites.net/content/site/img/logo.png

Tệp CSS được đặt trong/content/site/css và hình ảnh trên/content/site/img.

Tôi có thể thêm rằng bây giờ tôi không thể git push. Chỉ có trình hướng dẫn xuất bản hoạt động. Tôi đã gặp rất nhiều vấn đề với trang web đó trên Azure, 3 ứng dụng khác của tôi hoạt động hoàn hảo.

Answer 1

Tôi nghĩ trình chặn css của bạn đang phá vỡ mọi thứ.

Dưới đây là những gì tôi nhìn thấy trong bundled CSS của bạn từ trang chủ (Tôi đã bỏ minified nó một chút):

.brand 
{ 
    display:block;width:180px;height:34px;padding-top:0;padding-bottom:0;margin-top:2px; 
    margin-left:10px;overflow:hidden;font-size:18px;line-height:600px;color:#333; 
    background:url(../img/logo.png) no-repeat 0 0 
} 

Chú ý: background: url (../ img/logo.png) mà có thể không đúng từ CSS được thực hiện từ /bundles/

Nó nên nói:

../content/site/img/logo.png 

Hoặc như bạn nói /content/site/img/logo.png

này sẽ giải thích lý do tại sao nó hoạt động tại địa phương (không kèm) và thậm chí trong các lần triển khai trước - vì mã liên quan đến gói có thể đã thay đổi gần đây. Đây là một vấn đề thời gian phát hành cổ điển và đó là một lý do tại sao bật gói toàn thời gian (không chỉ trong chế độ Phát hành) là khôn ngoan, mặc dù phải mất thêm 0,500 giây tại thời gian biên dịch. :-)

Hy vọng điều đó sẽ hữu ích.