by @kodeazy

Angular How to add image in div tag without using <img> tag?

Home » Angular » Angular How to add image in div tag without using <img> tag?

In app.component.html add the below code

<div id="AddImage"></div>

In app.component.css add the below code

#AddImage{
    background: url("https://kodeazy.com/static/a71814a0c0f1c7eee1618883a731efc5/37c2d/image.jpg");
    height: 500px;
    width: 500px;
    background-size: 100% 100%;
  }

Here background property we specify the path of the image inside url("")
height and width properties are used to specify on how much width and height the image is displayed
background-size property specifies the number of parts the image should be divided on given height and width
If suppose background-size: 100% 50%; is given then the 100% width and 50% height is only taken by the image and for the remaining half the image is repeated by taking the same 100% width and 50% height.