HTML Como inserir uma imagem numa div

[Semnet]

Quero inserir logos da steam , xbox e playstation  nas divs , mas não vai de jeito nenhum. ai esta as divs:

  <section id="comprar">  
        <h2>COMPRE O JOGO ORIGINAL NOS SEGUINTES LINKS</h2>
      <div id="steam">
        <a href="https://store.steampowered.com/app/730/CounterStrike_Global_Offensive/?l=portuguese">Steam</a> <br>
      </div>
      <div id="xbox">
        <a href="https://marketplace.xbox.com/pt-br/Product/Counter-Strike-GO/66acd000-77fe-1000-9115-d8025841125a">Xbox</a> <br>
      </div>
      <div id="playstation">
        <a href="https://store.playstation.com/pt-br/product/UP2061-NPUB30589_00-HDDBOOTCSGO00001">PLaystation</a><br>
      </div>
    </section> 

Eu utilizei class , id e ficou na mesmo . Coloquei ids nos 'a' mas não deu em nada também 

[DiF]

@Semnet Você pode fazer de duas formas....  usando a imagem como background de um elemento div ou qualquer outro elemento... ou  inserir por tag src.

 

exemplo:

<div class="logo"></div>

CSS: 

.logo{
  width: 32px;
  height: 32px;
  background: url(logo.png);
}

 

Ou usar desta forma:

<div id="steam">
    
   <a href="https://store.steampowered.com/app/730/CounterStrike_Global_Offensive/?l=portuguese">
     <img src="logosteam.png" alt ="logo steam"/>
  </a>
 </div>

 

[Semnet]

@DiF Obrigado. O segundo funcionou perfeitamente mas o primeiro ele fica com um negocio cinza em vez da logo , olhe:

isto era onde era para ficar as logos

 

[DiF]

@Semnet como você fez?

 

pode ser erro de sintaxe, erro de caminho...  

Você precisa colocar o elemento div dentro do elemento de hipertexto e manipular com css.

 

Veja o exemplo https://jsfiddle.net/dife/hw4zsyk0/9/