Can the content: ""; is there an image tag or say image?

Question

Well, that's why I'm doing research, but still can't figure out if there is content: ""; may contain images randomly.

I don't have whether my question is suitable or not. But it would be nice to know if it can contain links to images. Thank.

For example, I have an image tag like:

<img src="kitten.jpg">

Can I add this image to the content property?

:after {
  content:" ";
}

Answer 1

From http://www.w3schools.com/cssref/pr_gen_content.asp property values content:

url(url) | Sets the content to be some kind of media (an image, a sound, a video, etc.)

So this will work:

.yourDiv:after { 
content: url('image-src'); 
}

Fragment example:

p:after {
  content: url('https://www.nasa.gov/sites/default/files/styles/image_card_4x3_ratio/public/thumbnails/image/leisa_christmas_false_color.png?itok=Jxf0IlS4');
  }

<div>
  <p>Some Stuff</p>
</div>

Run codeHide result

Answer 2

CSS content ... .

.seb-example:before {
    content: url('http://placekitten.com/250/250');
}

background-image :before ( :after), ( background-size). .

Answer 3

Why don't you give it a try?

You can use urlto display the image. The property contentwill contain any html content.

See an example below:

div,
div:after {
  display: inline-block;
  vertical-align: top;
}
div:after {
  content: url(http://placekitten.com/250/250);
}

<div>image</div>

Run codeHide result