Demonstração
Código sendo Usado:
 |
| Demonstração da Legenda. |
Comece colando a CSS que é o estilo da Legenda, procurando a tag b:skin e aciam dela cole este código:
Código:
td.tr-caption {
font-size: 90%;
background-color: #333;
display: inline;
padding: 5px 20px;
font-style: italic;
top: -50px;
float: right;
position: relative;
margin-bottom: -30px;
-webkit-box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.325);
-moz-box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.325);
box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.325);
}
font-size: 90%;
background-color: #333;
display: inline;
padding: 5px 20px;
font-style: italic;
top: -50px;
float: right;
position: relative;
margin-bottom: -30px;
-webkit-box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.325);
-moz-box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.325);
box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.325);
}
As partes em vermelho, vocês podem editar e colocarem as cores que vos desejarem.
Background-color: é a cor de fundo da legenda.
Color: é a cor da fonte do texto escrito.
Para ativar o código é só irem na imagem e clicar em adicionar legenda.
Se for ativar o código em outra plataforma, copie o seguinte código e cole em baixo da imagem em formato HTML:
<tr><td class="tr-caption" style="text-align: center;"> Digite aqui sua legenda.</td></tr>
Pronto, agora o resultado é igual ao da imagem acima:
|
| Demonstração da Legenda. |
Nenhum comentário:
Postar um comentário
Por favor leia antes de Comentar