更改元素之前圖像的大小

-1

我正在創建一個手機菜單和漢堡包菜單按鈕的圖像，我想調整圖像大小。我試着這樣做：更改元素之前圖像的大小

Can I change the height of an image in CSS :before/:after pseudo-elements?

但它沒有爲我工作。我的代碼是這樣的：

.nav-btn:before { 
     background-image: url('icons/mobile_menu_bttn.png'); 
     background-size: 16px 16px; 
     width: 16px; 
     height: 16px; 
     content:""; 
    }

它打破了代碼。

我本來這樣的代碼：

.nav-btn:before { 
     content: url('icons/mobile_menu_bttn.png'); 
}

我嘗試添加只是寬度和高度，並且也不能工作。

有誰知道我該如何做到這一點？

來源

2016-01-02 Becky

你能提供一個小提琴嗎？ – PDKnight

它打破它如何？該網站不運行？有什麼東西脫離對齊？你的CSS是什麼？所有事情都沒有澄清。你可以發佈一個CODEPEN或JFiddle的問題嗎？謝謝:) – LOTUSMS

這裏是一個小提琴：https://jsfiddle.net/#&togetherjs=RRaFMqOUel – Becky

a）將display: block;添加到:before。

b）將http://添加到圖片網址的開頭。

該按鈕仍然存在，工作得很好。但圖像資源無法找到，因此沒有圖像。即網址存在問題，至少Chrome是在控制檯中說的。

來源

2016-01-02 22:35:07 Roope

該圖像的作品。抱歉，在我運行它之前，我沒有更改代碼。我忘記了http：//之前。 https://jsfiddle.net/#run&togetherjs=RRaFMqOUel – Becky

這樣就可以顯示圖像，添加'display：block;'。但是，現在它在我的普通'nav-btn'類中忽略了我的'text-align：right'。 – Becky

@Becky無法再看到代碼。這就是爲什麼你應該在問題本身包含所有相關的代碼，包括HTML和CSS。所以請將代碼添加到問題中，以便我們可以複製該問題。 – Roope

更改元素之前圖像的大小

回答

相關問題