how to add a icon in html using your own image code example

Example 1: how to use i tag for custom icons, how to make custom icon

.main {
  display: inline-block;
  border: 2px solid grey;
  padding: 1rem;
  border-radius: 50%;
  .sub-main {
  i{
    background: url('./../assets/socialicon/facebook (1).svg');
    height: 1.2rem;
    width: 1.2rem;
    display: block;
    background-size: contain;
  }
  }
}


<div class="main">
  <div class="sub-main">
    <i>

    </i>

  </div>
</div>

Example 2: css how to place an icon on a photo

.container { position: relative; }
.container img { display: block; }
.container .fa-download { position: absolute; bottom:0; left:0; }