Base64圖像轉換-為什么？

Question

我在css中引用了png的列表，如下所示：

.nav-questions:before {
        background: url('../../../assets/images/nav-icons/question-list-icon-grey.png') no-repeat;
        width: 25px;
        height: 19px;
    }

有些圖像可以渲染，而有些則不能，我只能將其歸結為查看開發人員工具之間的差異。 可以渲染的圖像具有base64編碼，但是這怎么可能？為什么其他圖像不能渲染？

查看截圖示例：

Base64

非base64

Answer 1

這些圖像實際上是存在的，但這不是您請求它們的方式。 開發網站時，瀏覽器將連接到服務器，該服務器將發送資產：HTML頁面，CSS文件和圖像。 瀏覽器不允許直接訪問用戶的文件系統，這將是一個可怕的安全漏洞。 他們僅訪問服務器願意發送的任何資源。 因此，您需要設置一個服務器並通過瀏覽器中的localhost:port連接到它。 然后，服務器將提供圖像（當然，您也必須編寫此部分）。