Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Oi Rafael, tudo bem?
Vamos lá! O elemento é pai quando ele contém outro elemento que aí seria o filho. Veja o seguinte exemplo:
<html>
<head>
</head>
<body>
<h1>Exemplo</h1>
</body>
</html>O HTML não tem pai pois ninguém está contendo ele nesse caso. Ele é pai diretamente dehead e body. Consegue perceber isso? Agora, você acha que esses dois elementos são pais de alguém?
Olhando para o head podemos ver que ele não está contendo nada certo? Portanto, ele não é pai de ninguém.
Agora o body está envolvendo o h1 então ele é elemento pai dele, viu só?
Agora vamos para as diferenças entre relative e absolute:
Position relative: posiciona o elemento em relação a si mesmo. Ou seja, o ponto zero será o canto superior esquerdo, e ele começará a contar a partir dali. Todos os positions precisam de um ponto para iniciar o cálculo da coordenada para assim posicionar o elemento na tela. Ao contrário do que muitos acham, esse ponto não é o ponto central do elemento, o ponto base é o canto superior esquerdo do elemento. A partir deste canto, o browser irá calcular a coordenada que você definiu e irá posicionar o elemento no viewport.
Já o position absolute é um pouco diferente do Relative. O elemento com Position Relative utiliza seu próprio canto para referenciar sua posição certo? Só que o elemento com Position Absolute faz diferente, ele se utiliza do ponto superior esquerdo de outros elementos. Estes elementos são os parentes dele do elemento com position absolute. Mais especificamente o pai.
Isso é só um resumo, vou deixar aqui um artigo da própria Alura para você entender a propriedade position, com exemplos que você pode visualizar melhor.
Espero ter te ajudado :), bons estudos.