Próbuję wyświetlić obraz png na elemencie <button> w HTML. Przycisk ma taki sam rozmiar jak obraz, obraz się wyświetla ale nie jest w środku. Wygląda to tak, że prawy góry róg obrazu znajduje się na środku przycisku, a nie w prawym górnym rogu.
HTML:
<button id="close" class="closing" onClick="javascript:close_clip()"><img src="icons/close.png" /></button>
Wydaje mi się że to problem z amrginesem. Dostaję margines dwóch pikseli, więc obraz tła wychodzi z przycisku. Przycisk i obraz mają ten sam rozmiar, który ma tylko 20 piksel. Próbowałam marginesu: 0, wypełnienia: 0, ale to nie pomogło. Macie jakiś pomysł?
1 odpowiedź
możesz użyć input type image:
<input type="image" src="http://...." />
Działa jak przycisk i może mieć dołączone procedury obsługi zdarzeń. Alternatywnie możesz użyć css, aby dostylizować przycisk za pomocą obrazu tła i odpowiednio ustawić granice, marginesy itp.
<button style="background: url(obrazek.png)" ... />
