html頁面無法顯示css背景圖像

Question

我正在VS2010 ASP.NET Web應用程序項目上工作，並在其中添加了html頁面。 問題是啟動debug（F5）時，此頁面無法顯示在css文件中設置的某些圖標，但是直接打開html頁面時，那些背景圖像顯示得很完美。

CSS代碼是：

.leaflet-draw-toolbar a {
background-image: url('images/spritesheet.png');
background-image: linear-gradient(transparent,transparent),url('images/spritesheet.svg');
background-repeat: no-repeat;
background-size: 270px 30px;}

和相關的javascript是：

var drawnItems = L.featureGroup().addTo(map);
    map.addControl(new L.Control.Draw({
        edit: {
            featureGroup: drawnItems,
            poly: {
                allowIntersection: false
            }
        },
        draw: {
            polygon: {
                allowIntersection: false,
                showArea: true
            }
        }
    }));

調試

直接打開

我認為也許有些網絡配置限制了對資源的訪問。 劑量有人知道如何處理嗎？

謝謝！

Answer 1

我更改了CSS代碼，它起作用了：

.leaflet-draw-toolbar a {
background-image: linear-gradient(transparent, transparent), url('images/spritesheet.svg');
background-image: url('images/spritesheet.png');
background-repeat: no-repeat;
background-size: 270px 30px;}

如您所見，在以前的代碼中background-image在png上使用svg，現在我已更改為在svg上使用png。

因此，svg和png之間唯一的不同之處在於，我將學習有關svg的詳細信息。 我仍然猜測它與調試模式網站中提供的瀏覽器解釋svg的方式有關。