3

I want to replace the background-image:url(image.png) by an Unicode character or icon like "\xxxxx" in css

How to make it?

MrQd
  • 33
  • 1
  • 7

1 Answers1

1

How about using pseudo elements?

I suggest using 

:before

width z-index: -1;

Check my exmple here: https://jsfiddle.net/oyq47zsj/

I used "A" as background, but you can use any char

Paweł Michalski
  • 232
  • 1
  • 6
  • 1
    Great, or, if the OP wants the background to scale to the content (like background-size:contain), maybe something like [this](https://jsfiddle.net/MrLister/oyq47zsj/1/). – Mr Lister Oct 24 '16 at 06:48
  • The other important part used here is the `content` key in CSS – sebix Jan 10 '19 at 20:28
  • Thanks Pawel & Mr Lister, I just did [something cool](https://jsfiddle.net/7w1b3yhg/27/) thanks to your fiddles :) – sodimel Jul 05 '19 at 08:41
  • If you're trying to set the arrow for a dropdown menu, note that the :before and :after approach won't work in Firefox. – nicbou Jan 18 '22 at 14:08