martes, 12 de marzo de 2013

Etiquetas al Estilo Taringa en Blogger


 Bueno es este día les enseñare como colocarle mas estilo a nuestras etiquetas en blogger, esta ves tendrán el estilo de taringa, que ya todos conocemos. bueno empecemos


La etiquetas siempre se muestran con un código similar a este:

<span class='post-labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if></b:loop>
</b:if>
</span>
Eliminamos este código:

<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
Colocamos este Código antes de </b:skin>:

.post-labels {
margin: 0;
padding: 0;
}
.post-labels a {
float: left;
position: relative;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq6qAa1ntEZ7loC-pSJ_RD477JILW_HwKz5hrGEem6EtbNP2l9rR5Og_YFaUgnejiwP7EU7HfuYyxgxdwR2n0ugAtOYhD2bphMlndNkdo2UjZ8H_iqsieHFstIFt4A8jg9sJo7mdH3va4/s400/tag-taringa-ajmrdesign.com.png") no-repeat bottom right;
height: 24px;
line-height: 24px;
padding:0 10px 0 8px;
margin: 0 0 0 25px;
color: #333;
font-size:13px;
font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
text-decoration: none;
}
.post-labels a:before {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq6qAa1ntEZ7loC-pSJ_RD477JILW_HwKz5hrGEem6EtbNP2l9rR5Og_YFaUgnejiwP7EU7HfuYyxgxdwR2n0ugAtOYhD2bphMlndNkdo2UjZ8H_iqsieHFstIFt4A8jg9sJo7mdH3va4/s400/tag-taringa-ajmrdesign.com.png") no-repeat;
content: "";
width:15px;
height: 24px;
float: left;
position: absolute;
top: 0;
left: -15px;
}
.post-labels a:hover {
text-decoration: underline;
}

Y listo ya tenemos nuestras etiquetas a un mejor estilo

via: mil trucos blogger 

Descripcion en imagenes con efecto deslizante usando css

Una forma de agregarle mas estilo a nuestras imágenes y hacer que nuestro blogs sea mas profesional, es poniendo una pequeña descripc...