Che cos’è un’interruzione di riga HTML?

In HyperText Markup Language (HTML), un’interruzione di riga è un tag o una proprietà CSS (cascading style sheet) che fa sì che il visualizzatore HTML o il browser Web scenda immediatamente alla riga successiva disponibile e disegna l’elemento successivo, a partire dal margine. Esistono due modi generalmente accettati per inserire un’interruzione di riga HTML in un documento. Il primo consiste nell’utilizzare il tag break (BR), costringendo il browser ad avviare gli elementi successivi sulla riga successiva, allineati al bordo sinistro. L’altra opzione consiste nell’utilizzare diverse proprietà CSS per definire bordi, grondaie o spaziatura attorno agli elementi a livello di blocco per creare uno spazio aperto, sebbene questo metodo non influisca a capo automatico in un documento.

Uno dei principi di progettazione dell’HTML è che il browser di solito può avere un certo controllo sul layout delle pagine web. Ciò consente ai siti ben progettati di avere un aspetto molto fluido, indipendentemente dalle dimensioni del display. Quando viene disegnato un paragrafo, il browser di solito ha il compito di trovare il posto giusto per terminare una riga, di solito al margine destro di un blocco. L’utilizzo di un’interruzione di riga HTML implicita interrompe questo processo.

Il tag BR è il modo più semplice per terminare una riga e spostarsi verso il basso. L’uso del tag è generalmente accettato per alcune formattazioni minori, sebbene il suo utilizzo sia disapprovato come l’unico modo per definire i paragrafi in un documento. Il tag di paragrafo è preferito per separare aree di testo, perché crea un blocco che può essere manipolato con CSS o altri tag, mentre il tag di interruzione di riga HTML sta da solo e non racchiude un blocco. Il tag break può essere utilizzato all’interno di un blocco di paragrafo, principalmente per impedire al browser di utilizzare due interruzioni tra i paragrafi, che è il comportamento predefinito.

Un altro metodo utilizzato per causare un’interruzione di riga consiste nell’aumentare le dimensioni di una casella di testo con proprietà CSS. Questo estende efficacemente il fondo di un contenitore in modo che venga lasciato uno spazio vuoto dopo di esso. Può sembrare lo stesso dell’utilizzo di un tag di interruzione o paragrafo, tranne per il fatto che il testo all’interno del contenitore non viene modificato, quindi il ritorno a capo è ancora ampiamente controllato dal browser.

Un’area in cui potrebbe essere necessario specificare un’interruzione di riga HTML è quando il testo si avvolge attorno a un’immagine in linea. Un modo semplice per creare paragrafi formattati in modo pulito che si trovano a lato di un’immagine consiste nell’utilizzare il modificatore CLEAR per il tag di interruzione di riga HTML. Ciò consente di specificare se un’interruzione di riga deve continuare normalmente o passare alla riga successiva disponibile dopo un’immagine. È anche possibile creare stili CSS che imitino questo comportamento, anche se potrebbe non essere così fluido in determinate circostanze.