códigos úteis
Página 1 de 1
Re: códigos úteis
BOX-SHADOW
- Código:
box-shadow: -3px 5px 0px 0px #000
Última edição por Ojou-sama em Sex Ago 07, 2015 2:27 pm, editado 1 vez(es)
Re: códigos úteis
TEXTO 3D
Lorem Ipsum
- Código:
text-shadow: -0.06em 0pt red, 0.06em 0pt cyan;
Última edição por Ojou-sama em Sex Ago 07, 2015 2:28 pm, editado 1 vez(es)
Re: códigos úteis
BLUR
- Código:
<style type="text/css">.babyblur { -webkit-filter: blur(1px); -moz-filter: blur(1px); -o-filter: blur(1px); -ms-filter: blur(1px); filter: blur(1px);}</style>
Re: códigos úteis
ESPAÇO NA PRIMEIRA LINHA DO PARÁGRAFO
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
- Código:
(3x) Lorem...
Re: códigos úteis
BARRA DE ROLAGEM HORIZONTAL
- Código:
<style> .newspaper {-webkit-column-width: 140px; column-width: 140px; -webkit-column-gap: 10px; -moz-column-gap: 10px; column-gap: 10px; -webkit-column-span: all; column-span: all;}</style>
-webkit-column-width: 140px; // LARGURA DA COLUNA
-webkit-column-gap: 10px; // ESPAÇO ENTRE COLUNAS
-webkit-column-gap: 10px; // ESPAÇO ENTRE COLUNAS
Re: códigos úteis
- Código:
<link rel="stylesheet" href="http://static.tumblr.com/mer5yye/YTZofczr4/font-awesome.min.css">
Re: códigos úteis
- Código:
/*THIS IS THE CSS*/
.tabs {
position: relative;
width: /*here*/;
height: /*here*/;
}
.tab {
float: left;
}
.tab label {
background: #eee;
padding: 10px;
border: 1px solid #ccc;
margin-left: -1px;
position: relative;
left: 1px;
top: 0px;
}
.tab [type=radio] {
display: none;
}
.content {
position: absolute;
top: 28px;
bottom: 0px;
left: 0px;
right: 0px;
background: white;
padding: 20px;
border: 1px solid #ccc;
}
.tab [type=radio]:checked ~ label {
background: white;
border-bottom: 1px solid white;
z-index: 2;
}
.tab [type=radio]:checked ~ label ~ .content {
z-index: 1;
}
<!---THIS IS THE HTML--->
<center><div class="tabs">
<div class="tab">
<input type="radio" id="tab-1" name="tab-group-1" checked>
<label for="tab-1">Tab One</label>
<div class="content">
tab one stuff
</div>
</div>
<div class="tab">
<input type="radio" id="tab-2" name="tab-group-1">
<label for="tab-2">Tab Two</label>
<div class="content">
tab two stuff
</div>
</div>
<div class="tab">
<input type="radio" id="tab-3" name="tab-group-1">
<label for="tab-3">Tab Three</label>
<div class="content">
tab three stuff
</div>
</div>
</div></center>
.tabs [não tocar na position]
.tab [não tocar]
.tab label [quadradinho de todas as abas]
margin-left: (X)px [altera a distância entre abas, quanto maior o número, mais distantes as abas vão ficar]
left/top: [controla a posição das abas em relação ao quadradão]
.tab [type=radio] [não tocar]
.content [quadradão colado às abas, alterações aqui vale para todos]
.tab [não tocar]
.tab label [quadradinho de todas as abas]
margin-left: (X)px [altera a distância entre abas, quanto maior o número, mais distantes as abas vão ficar]
left/top: [controla a posição das abas em relação ao quadradão]
.tab [type=radio] [não tocar]
.content [quadradão colado às abas, alterações aqui vale para todos]
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos
|
|