From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/pt-pt/web/css/top/index.html | 54 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 54 insertions(+) create mode 100644 files/pt-pt/web/css/top/index.html (limited to 'files/pt-pt/web/css/top/index.html') 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 +--- +

« Referência CSS
+

+

Resumo

+

A propriedade top especifica o posicionamento vertical do elemento de acordo com o topo.

+

Para elementos absolutamente posicionados (com a propriedade position ajustada como absolute ou fixed) especifica a distância apartir a margem superior do objeto (até onde vai o background).

+

Para relativamente posicionados (com a propriedade position ajustada como relative) especifica a distância de acordo com o posicionamento do objeto se a propriedade position fosse qualquer uma que não absolute, relative ou fixed.

+ +

Sintáxe

+
top: <length> | <percentage> | auto | inherit
+
+

Exemplos

+
<?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>
+
+

Notas

+

top é mais relevante que bottom porque o alinhamento vertical padrão é no topo. Com mais propriedades de posicionamento, top torna-se dispensável.

+

Veja mais

+

position, right, bottom, left

-- cgit v1.2.3-54-g00ecf