Hi!
Trouxe alguns modelos para sidebar
Para usar procure por: /*Widget
E depois de : -----------------
Apague até chegar em /*Mobile (Não apague essa tag)
.sidebar .widget {
background:#Cor;
padding: 10px;
margin-left: -13px;
margin-top: 0px;
margin-bottom:25px;
border-top: 4px solid #Cor;
border-bottom: 4px solid #Cor;
border-radius:0px;
box-shadow:inset 0 0 8px #Cor; 0 0 3px #Cor;
}
.sidebar .widget h2 {
-webkit-transition: color 0.7s ease-out;-moz-transition:
color 0.7s ease-out;transition: color 0.7s ease-out;
margin-bottom: -6px;
margin-top: -5px;
font: normal bold 25px'Sail', cursive;
text-align: center;
color: #Cor;
}
.sidebar .widget h2:hover {
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
color: #Cor;
}
.sidebar .widget {
width:100% !important;
background:#fafafa;
border-radius:2px 15px 2px 15px;
padding:10px;
-webkit-box-shadow: 0px 0px 10px #b5b5b5;
-moz-box-shadow: 0px 0px 10px #b5b5b5;
box-shadow: 0px 0px 10px #b5b5b5;
}
.sidebar h2 {
font-family: Century Gothic;
color: #ffa6a4;
font-size: 18px;
text-align: right;
text-shadow:0 1px #b5b5b5;
padding: -5px;
border-bottom: 1px dotted #b5b5b5;
-webkit-transition-duration: 1.00s;
}
.sidebar h2:hover {
letter-spacing: -3px;
color: #bcdbe4;
-webkit-transition-duration: 1.00s;
}
.sidebar .widget {ANTES DE B:SKIN
border-bottom: 3px solid #d887b9;
border-top: 3px solid #d887b9;
background: #fafafa;
box-shadow: inset 0 0 5px #e0e0e0, 0 0 2px #b5b5b5;
padding:12px;
padding-bottom: 20px;
}
.sidebar h2 {
font-family: Century Gothic;
color: #fff;
font-size: 18px;
text-align: right;
text-shadow:0 1px #b5b5b5;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1F4D62FzyInjg-kAiWFzFeCA8cFpgMdNNpGO4BGggQsfBBqrEZqo45e2aSIyJczCU5-uBt685mCykrtUhdCctuP-3vWzWRWxTqfb4ma02U13nXZ0wcbHE9EVSIJNaLzNwoeyFkEgJB_RS/s1600/ribbonspsd.png) no-repeat left;
height: 28px;
width: 260px;
margin-top:-5px ;
margin-left:-45px ;
padding:5px;
width:128%;
.sidebar .widget {
padding-bottom: 10px;
padding-left: 5px;
padding-right: 5px;
margin: 10px 0;
background: #fff;
box-shadow: 0px 0px 2px #ccc;
}
.sidebar h2 {
margin-top: 8px;
border-bottom: 1px solid #eee;
text-align: center;
height: 15px;
font-size: TAMANHODAFONTEpx;
font-family: NOMEDAFONTE;
color: #CORDAFONTE;
text-shadow: 0px 0px 5px #CORDASOMBRADAFONTE;
text-transform: uppercase;
}
Ah duvida cruel entre o ultimo e o primeiro..... Muito legal estes modelos sao lindos
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluir