Caixa de texto em html (Blogger)

[Saulo Samp]

E aí pessoal beleza?, eu queria pedir a ajuda de vocês sobre caixas de texto em html, eu queria fazer uma igual a essa:

Com os nomes em links para as pessoas que entrarem no blog após irem na postagem eles clicarem aí para baixar o que tiver p/ download...

Agradeço à ajuda. 

[Josh Slash]

Boa noite, isso não é feito com tabela não?

[Saulo Samp]

48 minutos atrás, Josh Slash disse:

Boa noite, isso não é feito com tabela não?

Sinceramente não sei cara, eu só queria que alguém pudesse me explicar como se faz isso, eu já procurei muito mas só vi tutoriais antigos que não me ajudaram... :/

[DiF]

@Saulo Samp isso basicamente é um elemento HTML com um link <a>

As tags utilizadas são bem básicas!

 

Por exemplo:

<div class="box">
  <p>DOWNLOAD: <a class="branco" href="Seu link aqui">LINK DIRETO</a> / <a class="azul" href="Seu link aqui">DOWNLOAD: MEGA</a></p>
</div>  

No CSS você define regras para que os estilos e cores sejam aplicados.. por exemplo quer deixar a borda azul, Link direto branco, Link mega azul centralizado 

.box{
  width: 600px;
  height: 50px;
  border: 2px solid blue; 
  background: #000; 
  color: #fff;
  font-family: arial;
  font-weight: bold;
}

.box p{
  text-align: center;
  line-weight: 50px;
}

.box a{text-decoration: none;}

.branco{ color: #FFFFFF;}
.azul{color: blue;}

Veja um exemplo prático online:  https://jsfiddle.net/205tcfh1/

[Saulo Samp]

16 horas atrás, DiF disse:

@Saulo Samp isso basicamente é um elemento HTML com um link <a>

As tags utilizadas são bem básicas!

 

Por exemplo:

<div class="box">
  <p>DOWNLOAD: <a class="branco" href="Seu link aqui">LINK DIRETO</a> / <a class="azul" href="Seu link aqui">DOWNLOAD: MEGA</a></p>
</div>  

No CSS você define regras para que os estilos e cores sejam aplicados.. por exemplo quer deixar a borda azul, Link direto branco, Link mega azul centralizado 

.box{
  width: 600px;
  height: 50px;
  border: 2px solid blue; 
  background: #000; 
  color: #fff;
  font-family: arial;
  font-weight: bold;
}

.box p{
  text-align: center;
  line-weight: 50px;
}

.box a{text-decoration: none;}

.branco{ color: #FFFFFF;}
.azul{color: blue;}

Veja um exemplo prático online:  https://jsfiddle.net/205tcfh1/

Muito obrigado mesmo mano!!