Praticando: Criando elementos HTML no Javascript

Oi, Rodrigo! Tudo bem?

Desde já, peço desculpas pela demora em retornar.

Para que o conteúdo englobado pela tag p permaneça com seu tamanho normal, precisamos modificar o seguinte trecho de código:

h1.appendChild(p)

O método appendChild tem como objetivo inserir novos conteúdos ao elemento selecionado, o qual será a tag mãe. Com o código acima, afirmamos que a tag h1 será mãe da tag p e, por esse motivo, as características de h1 também farão parte do parágrafo, deixando-o, por exemplo, com fonte maior.

Como queremos adicionar o parágrafo dentro da div, podemos substituir o h1 por div, desta forma:

div.appendChild(p)

Desse modo, somente o conteúdo da tag h1 ficará em destaque (com fonte maior), ao passo que a frase dentro da tag p, não.

Após essa modificação, teremos o resultado final do código será:

var body = document.querySelector('body')
var div = document.createElement('div')
var h1 = document.createElement('h1')
var p = document.createElement('p')
h1.textContent = 'Bem Vindo ao Fórum da Alura'
p.textContent = 'Esse é um teste de como criar elementos HTML no Javascript'

body.appendChild(div)
div.appendChild(h1)
div.appendChild(p)

Rodrigo, espero tê-lo ajudado! Fico à disposição caso surjam dúvidas após a minha explicação ou ao longo dos seus estudos.

Até mais!