I have difficulty understanding the logic

The logic is:

• create a function called fontes that receives as input any phrase

Here is a minimalist example of function

function fontes(frase){
    alert(frase); // só para verificar
};

• Type this sentence in the body of the page using different font sizes (from 1 to 7)

Here you need to "fetch" the body of the page and save it in a variable:

var corpo = document.querySelector('body'); // ou outro elemento que queira

• For this, you should make a loop that will repeat the following TAG by changing only the "size" attribute

Now a typical% loop% is

for (var i = 1; i < 8; i++) {
   // fazer qq coisa
}

In this case, within the loop you must change the css / style of the text. Here is a step that is not defined in the question: how to package the sentence? with for , div or <p> ? ecolha.

If you use a <span> the code inside the loop could be:

corpo.innerHTML += '<p style="font-size: '+i+'em;">'+frase+'</p>';

Example: link

Final code:

function fontes(frase) {
    var corpo = document.querySelector('body');
    for (var i = 1; i < 8; i++) {
        corpo.innerHTML += '<p style="font-size: ' + i + 'em;">' + frase + '</p>';
    }
};
fontes('Olá mundo!');

You can create N elements, but as you have not specified, I will leave in example with element font :

function fontes(frase){
    for(var i = 1; i <= 7; i++){ // laço para criar os elementos
      var e = document.createElement('font'); // cria um elemento font
      e.setAttribute("size",i); // altera o atributo size
      e.innerHTML = frase; // adiciona a frase no elemento
      document.body.appendChild(e); // adiciona no body
    }
}
fontes('Stackoverflow '); // chama a função

JSFiddle Example