Firefox Inkompatibilität mit img Inhalt URL

Ich versuche, die 'img src' in der CSS-Datei zu setzen. Ich habe verschiedene Methoden studiert, die verwendet werden könnten, aber es funktioniert noch nicht. wenn die :: nachher in der CSS in Chrome dann nicht funktioniert, aber in Firefox funktioniert mit anderen Stil. Erste ein wenig, eine Idee zu dieser Lösung verwirrt: https://jsfiddle.net/er1txx0z/Firefox Inkompatibilität mit img Inhalt URL

<label class="control-label"></label>  
    <button id="btn1" class="btn btn-warning shadow dcweb_search" disabled="true"> 
    <img class="dcweb_search_img" /> 
    </button> 


    <style> 
    .dcweb_search{ 
    height: 60px; 
    width: 60px; 
    position: relative; 
    top:-17px 
    } 
    .dcweb_search_img{ 
    width:40px; 
    content:url('https://api.icons8.com/download/c5c8b5ba35e008ea471e9a53c5fa74c03ef6e78c/iOS7/PNG/256/Very_Basic/search-256.png'); 
    } 
    </style>

Quelle

2016-04-11 KOrrosh Sh

Firefox nicht die Inhalte Eigenschaft in der gleichen Weise wie Chrome unterstützen. http://stackoverflow.com/questions/12262118/content-url-is-not-working-in-firefox –

Warum legen Sie nicht src im 'img' Tag selbst fest? –

weil in der CSS-Datei kann nicht SRC der Bilder eingestellt werden, und stattdessen müssen Sie Content-URL verwenden. Ich kann es nicht im HTML-Tag tun, da das Bild des Links im Hover anders ist! –

Sie das Bild als background-image auf dem button Element festlegen. Kein Problem mit dem img Tag.

.dcweb_search { 
 
    height: 60px; 
 
    width: 60px; 
 
    position: relative; 
 
    top: -17px; 
 
    background-image: url('https://api.icons8.com/download/c5c8b5ba35e008ea471e9a53c5fa74c03ef6e78c/iOS7/PNG/256/Very_Basic/search-256.png'); 
 
    background-size: 40px 40px; 
 
    background-position: center; 
 
    background-repeat: no-repeat; 
 
}

<label class="control-label"></label> 
 
<br> 
 
<button id="btn1" class="btn btn-warning shadow dcweb_search" disabled="true"> 
 
</button>

Quelle

2016-04-11 09:59:34 Roy

Ich habe diese Lösung bisher gemacht, aber es funktioniert nicht gut mit den Symbolen, die ich habe, sowieso tnx viel :) Ich sollte die Symbole ändern –

Firefox Inkompatibilität mit img Inhalt URL

Antwort

Verwandte Themen