24.7.14

Modelos de marcadores



Oii fofuras,, Tudo bem ??

Desculpa a demora do layout, Bom o importante é que ele veio né :)
Uma menina falou para mim postar um pouco mais de tutoriais e eu vou postar né :D
Os créditos vão para Princess tutoriais


Primeiro adicione ao seu blog o gadget dos marcadores


Depois vá ao html de seu blog, aperte ao mesmo tempo as teclas ctrl f  e procure por  ]]></b:skin>, Quando encontrar coloque o código que desejar acima desta tag ou procure por: .sidebar .widget { apague todo o código, desde  .sidebar .widget { e coloque o código de um dos modelos.

Modelo I

.widget ul, .widget #ArchiveList ul.flat {
list-style: none;
padding: 5px;
}
.widget ul li, .widget #ArchiveList ul.flat li {
background-color: #f4f4f4;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
padding: 5px;
margin: 2px;
border-bottom: solid 1px #e3e1e2;
text-align: center;
-webkit-transition-duration: .50s;
}
.widget ul li:hover {
background: #ffcad4;
border-bottom: solid 1px #fcb0be;
-webkit-transition-duration: .50s;
}

Modelo II
.widget ul, .widget #ArchiveList ul.flat {
list-style: none;
padding: 5px;
}
.widget ul li, .widget #ArchiveList ul.flat li {
text-align: center;
border-bottom: dotted 1px #d5d5d5;
-webkit-transition-duration: .50s;
}
.widget ul li:hover {
background: #f4f2f4;
-webkit-transition-duration: .50s;
}

Modelo III

#Label1 ul li{
float: left;
width: 45%;
font-family: 'Dosis', sans-serif; /* fonte, se preferir troque */
text-transform: uppercase; /* letras em maiúsculo, se não quiser apague a linha */
font-size: 16px; /*tam. da fonte*/
background: #fff; /*fundo*/
border-bottom: 2px solid #ccc; /* borda de baixo do marcador */
margin: 5px;
font-weight: normal;
list-style-type:none;
}
#Label1 ul li:hover{
background: #EAEAEA; /*fundo hover*/
border-bottom: 2px solid #FF51A8; /* borda de baixo do marcador hover */
}

Modelo IV
Para este modelo você deve configurar o gadeget de marcadores 
como o modelo abaixo:
.label-size{
margin:0;
padding:0;
position:relative;
}
.label-size a{
float:left;
height:24px;
line-height:24px;
position:relative;
font-size:12px;
margin-bottom: 9px;
margin-left:20px;
padding:0 10px 0 12px;
background:#0089e0;
color:#fff;
text-decoration:none;
-moz-border-radius-bottomright:4px;
-webkit-border-bottom-right-radius:4px;
border-bottom-right-radius:4px;
-moz-border-radius-topright:4px;
-webkit-border-top-right-radius:4px;
border-top-right-radius:4px;
}
.label-size a:before{
content:"";
float:left;
position:absolute;
top:0;
left:-12px;
width:0;
height:0;
border-color:transparent #0089e0 transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0;
}
.label-size a:after{
content:"";
position:absolute;
top:10px;
left:0;
float:left;
width:4px;
height:4px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
background:#fff;
-moz-box-shadow:-1px -1px 2px #004977;
-webkit-box-shadow:-1px -1px 2px #004977;
box-shadow:-1px -1px 2px #004977;
}
.label-size a:hover{background:#555;}
.label-size a:hover:before{border-color:transparent #555 transparent transparent;
}
Modelo V
.sidebar ul li { list-style: none; margin: 0; padding: 0; border-bottom:1px solid #fee; padding: 0 0 4px 12px; background: url("http://3.bp.blogspot.com/-edd6RlHEe_s/TnO4PIymJzI/AAAAAAAABv8/XLoXHiXnQyE/s1600/mini-153.gif") no-repeat 0 2px; }

Nenhum comentário:

Postar um comentário

。 Ei carinha fofa >< seja gentil e não seja mal - - Educado :D
。 Cupcakes de morando deixe o link do seu blog eu visitarei
。 De sua opnião ,, mais se for muito mal eu não me aguentarei de raiva ...
。 Respondo todos os comentários rsrs... ... ... ...
。◕‿◕。 Hey... e obrigada pelo comentário use nossas carinhas

❣◕ ‿ ◕❣ ✿◕ ‿ ◕✿ ❀◕ ‿ ◕❀
❁◕ ‿ ◕❁ ✾◕ ‿ ◕✾ ◡‿◡✿
✿◠‿◠ ≧◔◡◔≦ ಥ_ಥ
≧�◡�≦ ≧^◡^≦ ≧✯◡✯≦
✿⍲◡⍲ ◕‿‿◕ ( ● ω ● )>(o゜ェ゜o)