Avisos + Caixa com bordas transparentes
Boa tarde, hoje trouxe mais um daqueles posts chato eca, mais um daqueles em que eu dou alguns avisos rs.
Então, o primeiro aviso é que eu finalmente abri uma ask no tumblr então podem pedir tutoriais, materiais etc.. O segundo é que eu estarei visitando meus afiliados e comentando sempre, aqueles que não nos visitarem estarão excluídos da minha elite ok!? Decidi também que aquele ultimo template voltará, mais com outros personagens ~suspense~.
E hoje vou ensinar a colocar aquela caixa branca com bordas meio transparentes que fica ali no cabeçalho, achei ela super útil e bonita, peguei ela em um tumblr chamado HTMLuv.
Let's Go?!
Vá lá no seu HTML e procure por ]]></b:skin> depois cole o seguinte código acima dessa tag que você procurou.
.bordtrans {Também deixei as instruções no próprio código pra vocês modificarem o estilo da caixa como quiser.
background-color: #fff; /*---- cor da caixa ----*/
-moz-background-clip: padding;
-webkit-background-clip: padding;
background-clip: padding-box;
border: 10px solid rgba(255,255,255,0.4); /*---- espessura da borda----*/
-webkit-border-radius: 6px; /*---- borda arredondada retire se quiser ----*/
-moz-border-radius: 6px; /*---- borda arredondada retire se quiser ----*/
border-radius: 6px; /*---- borda arredondada retire se quiser ----*/
padding: 10px;
width: 500px; /*---- tamanho da caixa de texto ----*/
color:#a8a8a8; /*---- cor da borda da caixa ----*/
text-shadow:1px 1px 0px #f7f7f7;/*---- Sombra do texto da caixa ----*/
text-align: justify;
}
Agora abra um gadget JAVA e cole o seguinte código.
<div class="bordtrans">Pronto só escrever seu texto .
TEXTO QUE APARECE DENTRO DA CAIXA
</div>
_Guuh
Adorei esse template, eu adorei essa caixinha *-*
ResponderExcluirEi a o Victory já é seu afiliado, mas eu queria fazer também com o Space, aceita?
Obrigado, e aceito sim a ultima vaga é sua hah
ExcluirWOW, que menino rígido rsrs, tirandos os afiliados u_u. Mas falando sério eu adorei o tuto, ele foi criado por você? Parabéns :)
ResponderExcluirjovenclube(.blogspot.com.br)
Nem to tão rígido assim tem blog que é pior kkk mais esse tuto é de um tumblr eu só converti e fiz algumas alterações.
ExcluirQue tutu massa, Confesso que não tinha nem reparado que era uma caixa separada, vi só agora que passei o mouse e selecionei as palavras kkkk
ResponderExcluirgarotoimoral.blogspot.com
kkkk, Obrigado (=
ExcluirSuper curti o design natalino ^^
ResponderExcluirAh, ótimo tutorial!
Abraços,
Revolução Nerd
Haha Obrigado =D Abraços
Excluiramei fica muito legal, amei o lay do blog
ResponderExcluirretribui?
Adolescente Nerd
Hih Muito obrigado Retribuo sim.
ExcluirObrigado (=
ResponderExcluir