

Seu próximo nível começa aqui
Seu desenvolvimento não pode ter limites. Garanta sua Assinatura Ilimitada e libere uma preparação completa com os melhores professores do Brasil.
Observe os códigos HTML e CSS a seguir:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" /
<title></
<link rel="stylesheet" href="estiloProva.css"/
</
<body>
<div class="figura1">
<div class="figura2">
</
</
</
</
Conteúdo do arquivo “estiloProva.css”:
.figura1 {width: 650px;height: 300px; border:5px dotted black; float: left; margin: 30px;}
.figura2 {width: 100px;height: 100px; position: relative; background-color: blue; top: 20px; left: 150px;}
A tela exibida pelo navegador conterá um retângulo com borda
pontilhada, com distância de 30 pixels do topo, tomando a tela do navegador como referência. Abaixo desse retângulo aparecerá um quadrado azul posicionado a 150 pixels da borda esquerda, tomando a tela do navegador como referência e a 20 pixels de distância da borda inferior do retângulo.
pontilhada, com distância de 30 pixels do topo, 30 pixels da lateral esquerda, 30 pixels da lateral direita e 30 pixels da base inferior, tomando a tela do navegador como referência. No interior desse retângulo aparecerá um quadrado azul posicionado a 150 pixels da borda esquerda do retângulo e a 20 pixels de distância da borda superior do retângulo.
dupla. No interior desse retângulo, um quadrado azul posicionado a 150 pixels da borda esquerda do retângulo e a 20 pixels de distância da borda superior, tomando a tela do navegador como referência.
dupla, com distância de 30 pixels do topo, 30 pixels da lateral esquerda, 30 pixels da lateral direita e 30 pixels da base inferior, tomando a tela do navegador como referência. Ao lado direito desse retângulo aparecerá um quadrado azul posicionado a 150 pixels de sua borda e a 20 pixels de distância da borda superior, tomando a tela do navegador como referência.