Blocco HTML e elementi in linea | spiegato

Blocco HTML e elementi in linea | spiegato
Gli elementi in HTML possono essere classificati in due elementi più ampi, in linea e blocca. Gli elementi di blocco rompono il flusso di contenuto e avviano una nuova linea mentre gli elementi in linea mantengono il contenuto all'interno della linea e occupano solo una quantità specifica di spazio. Gli elementi del blocco prendono tutto lo spazio della larghezza dell'elemento genitore e la loro rottura della linea si estende anche la pagina in verticale.

Poiché HTML supporta un lungo elenco di elementi, può essere difficile per un nuovo programmatore HTML differenziarli. Tenendo conto dell'importanza, questa guida presenta il seguente risultato di apprendimento:

  • illumina le differenze tra elementi a blocchi e in linea
  • Dimostrare diversi elementi di blocco e in linea

Quali sono le differenze tra elementi a blocchi e in linea

I seguenti sono i punti di differenziazione che chiarirebbero il concetto di elementi a blocchi e in linea in HTML.

  • Gli elementi del blocco aggiungono spazio rompendo la linea prima e dopo averla utilizzata. Mentre gli elementi in linea sono praticati all'interno della linea specifica e non consumano spazio extra.
  • Gli elementi in linea supportano solo l'imbottitura sinistra e destra mentre gli elementi a blocchi supportano l'imbottitura in entrambe le direzioni verticali e orizzontali
  • Gli elementi in linea supportano piccoli file mentre creano piccole strutture. Mentre gli elementi di blocco supportano file di grandi dimensioni mentre creano strutture di grandi dimensioni.
  • Quando viene chiamato un elemento in linea, funziona solo per quei file che richiedono quell'elemento in linea. D'altra parte, gli elementi del blocco contengono vari elementi a blocchi e in linea. Pertanto, quando viene chiamato l'elemento del blocco genitore, verrebbero applicati tutti gli elementi a blocco e in linea.

Come funzionano gli elementi di blocco e in linea in HTML

Questa sezione fornisce la funzionalità di diversi elementi di blocco e in linea.

Blocca elementi: Abbiamo fornito l'applicabilità di pochi elementi di blocco in HTML che mostra il comportamento pratico degli elementi a blocchi.

Usando

: Il tag di paragrafo in HTML rappresenta le righe di testo e cade nella categoria degli elementi di blocco di HTML.






Blocca elementi in HTML


Questo è un paragrafo



L'output del codice HTML su una pagina Web è fornito di seguito:+

Sebbene il testo del paragrafo sia limitato a poche parole, tuttavia, il tag paragrafo ha preso la larghezza completa (a partire dalla pagina).

Usando: Pratichiamo il tag più importante e comunemente usato utilizzando il seguente codice HTML.






Blocca elementi in HTML


Questo è un div



L'interfaccia Web del tag sopra è mostrata di seguito:

Come l'elemento di blocco del paragrafo, il tag DIV ha anche occupato l'intera larghezza della pagina.

Usando

dentro : Come indicato e rappresentato in precedenza, gli elementi del blocco occupano la larghezza completa della pagina (tag genitore). È possibile limitare la larghezza del tag principale e i tag figlio occuperebbero lo spazio definito nel tag genitore. Ad esempio, il seguente codice HTML pratica il

tagga etichetta.






Blocca elementi in HTML



questa è una pargaph




Il codice di cui sopra dichiara un tag che occupa il 50% della larghezza della pagina. UN

Il tag viene utilizzato all'interno del tag e il paragrafo occupa il 50% dello spazio del suo tag genitore ().

A parte e

, Di seguito sono descritti diversi altri elementi a blocchi:
: utilizzato per rappresentare le informazioni di contatto
: Il contenuto dell'articolo può essere descritto utilizzando questo tag


: Utilizzato per separare il contenuto per linee orizzontali
: La didascalia della figura è assegnata usando questo tag.

A

: Questi tag definiscono l'intestazione di varie dimensioni da

A


: Utilizzato per iniziare una nuova sezione
: è possibile assegnare il piè di pagina di una pagina o di una sezione
: può essere utilizzato per inserire una tabella in HTML DOC.
    : utilizzato per impostare un elenco ordinato