diff options
Diffstat (limited to 'files/pt-pt/web/css/top/index.html')
| -rw-r--r-- | files/pt-pt/web/css/top/index.html | 54 |
1 files changed, 54 insertions, 0 deletions
diff --git a/files/pt-pt/web/css/top/index.html b/files/pt-pt/web/css/top/index.html new file mode 100644 index 0000000000..3e2f304073 --- /dev/null +++ b/files/pt-pt/web/css/top/index.html @@ -0,0 +1,54 @@ +--- +title: top +slug: Web/CSS/top +translation_of: Web/CSS/top +--- +<p><span class="lang lang-en">« <a href="/pt/Referência_CSS" title="pt/Referência CSS">Referência CSS</a><br> +</span></p> +<h3 id="Resumo"><span class="lang lang-en">Resumo</span></h3> +<p>A propriedade <code>top</code> especifica o posicionamento vertical do elemento de acordo com o topo.</p> +<p>Para elementos absolutamente posicionados (com a propriedade <code>position</code> ajustada como <code>absolute</code> ou <code>fixed</code>) especifica a distância apartir a margem superior do objeto (até onde vai o <code>background</code>).</p> +<p>Para relativamente posicionados (com a propriedade <code>position</code> ajustada como <code>relative</code>) especifica a distância de acordo com o posicionamento do objeto se a propriedade position fosse qualquer uma que não <code>absolute</code>, <code>relative</code> ou <code>fixed</code>.</p> +<ul> <li>Valor inicial: auto</li> <li>Aplica-se a: <a href="/pt/CSS/position" title="pt/CSS/position">Elementos posicionados</a></li> <li>Herdado: não</li> <li>Porcentagens: Referente a altura do próximo antecedente de posição block</li> <li>Valor computado: distância absoluta, porcentagem ou automático</li> +</ul> +<h3 id="Sintáxe">Sintáxe</h3> +<pre class="eval">top: <length> | <percentage> | auto | inherit +</pre> +<h3 id="Exemplos">Exemplos</h3> +<pre><?xml version="1.0" encoding="utf-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> +<head> +<meta http-equiv="Content-Type" content="application/xhtml+xml" /> +<title>Mozilla.org altura, topo, esquerda, largura e direita - CSS</title> +<style type="text/css"> +/* As medidas de body podem ser mudadas para px para testar o comportamento da div */ +body{ + width: 100%; + height: 100%; +} +/* agora a div pode operar com porcentagem (a altura e a largura do body são a referência) */ +div{ + position: absolute; + left: 15%; + top: 30%; + bottom: 30%; + width: 70%; + height: 40%; + text-align: left; + border: 3px #000 solid; + background: #CCC; +} +</style> +</head> +<body> +<center> + <div>...Qualquer conteúdo...</div> +</center> +</body> +</html> +</pre> +<h3 id="Notas">Notas</h3> +<p><code>top</code> é mais relevante que bottom porque o alinhamento vertical padrão é no topo. Com mais propriedades de posicionamento, top torna-se dispensável.</p> +<h3 id="Veja_mais">Veja mais</h3> +<p><a href="/pt/CSS/position" rel="custom nofollow" title="pt/CSS/position">position</a>, <a href="/pt/CSS/right" rel="custom nofollow" title="pt/CSS/right">right</a>, <a href="/pt/CSS/bottom" rel="custom nofollow" title="pt/CSS/bottom">bottom</a>, <a href="/pt/CSS/left" rel="custom nofollow" title="pt/CSS/left">left</a></p> |