Durante lo sviluppo di un sito Web, è necessario posizionare gli elementi in modo organizzato, in particolare quando si crea un componente che contiene un testo aggiuntivo. Nell'altro caso, se il testo è disorganizzato, causerà problemi di leggibilità. Per evitare questo problema, HTML offre un tag che può essere utilizzato per lo scopo specificato.

Questo manuale fornirà una guida sull'elemento HTML. Quindi iniziamo!

Prima di correre nella discussione relativa all'argomento dell'articolo, vediamo un esempio che dimostra l'elemento senza usare un tag di riepilogo.

Come elemento visualizzare il contenuto senza l'elemento?

Nel seguente esempio, visualizzeremo il contenuto utilizzando il "dettagli"Tag senza l'elemento di riepilogo:

Questa è una spiegazione dettagliata.

Per impostazione predefinita, l'elemento visualizza un dettaglio di intestazione che non è significativo da solo:

Dall'output sopra, si può osservare come funziona l'elemento dettagli senza l'elemento HTML.

Nella sezione successiva, verrà discusso l'uso corretto del tag HTML.

Cos'è il tag HTML?

In HTML, il ""L'elemento viene utilizzato all'interno dell'elemento per specificare un'intestazione. Questa intestazione è cliccabile per visualizzare o nascondere i dettagli.

Sintassi

contenuto…

Dettagli del contenuto ..

Di seguito è riportata la descrizione della sintassi sopra menzionata:

• • ""L'elemento specifica le informazioni aggiuntive.
  • ""L'elemento specifica un'intestazione visibile che viene cliccata per visualizzare o nascondere i dettagli.

Ora, vai verso il seguente esempio.

Esempio: come aggiungere tag in html?

In HTML, prima, aggiungi un elemento div con il nome della classe "FAQ". Poi aggiungi

elemento da aggiungere un'intestazione sulla pagina web. Successivamente, Place Tag, che contiene le informazioni dettagliate. All'interno di questo elemento, l'elemento viene utilizzato per specificare l'intestazione. Ne aggiungeremo altri due "dettagli"Elementi allo stesso modo.

Html

Domande frequenti

Come posso acquistare qualsiasi prodotto?

È possibile ottenere il prodotto semplicemente facendo clic sul pulsante Aggiungi al carrello e procedendo con il pagamento.

Quanto dura la consegna?

Puoi ricevere il tuo prodotto in due o tre giorni lavorativi.

Accettate in contanti alla consegna?

SÌ.

CSS

In CSS, gli elementi HTML sono dotati di diverse proprietà di styling.

Stile tutti gli elementi

*
Font-Family: Verdana, Ginevra, Tahoma, Sans-Serif;

Lo snippet di codice sopra rappresenta che il "famiglia di font"Con il valore Verdana, Ginevra, Tahoma, Sans-Serif viene applicato a tutti gli elementi. Inoltre, l'elenco degli stili di carattere viene utilizzato allo scopo che se il browser non supporta il primo, applicherà il secondo e così via.

FAQ STANI DIV

.FAQS
larghezza: 500px;
Altezza: 300px;
Margine: 0 Auto;
imbottitura: 20px;
Background-color: #B73E3E;
Cursore: puntatore;
Colore: Ghostwhite;
Font-size: 15px;

Le seguenti proprietà vengono applicate all'elemento con il nome della classe "FAQ:

• • "larghezza"La proprietà viene utilizzata per l'impostazione della larghezza dell'elemento.
  • "altezza"La proprietà viene utilizzata per l'impostazione dell'altezza dell'elemento.
  • "margine"Proprietà con valore"0 Auto"Indica lo spazio 0px nella parte superiore e inferiore e uguale spazio sul lato sinistro e destro dell'elemento div.
  • "imbottitura"Proprietà con un valore di"20px"Produce spazio 20px attorno al contenuto dell'elemento Div.
  • "colore di sfondo"La proprietà viene utilizzata per l'impostazione dello sfondo dell'elemento.
  • "cursore"Il puntatore visualizza il mouse come una mano con un dito indicatore.
  • "colore"La proprietà imposta il colore del carattere su Ghostwhite.
  • "dimensione del font"La proprietà regola la dimensione del carattere a 15px.

Stile H1 Element of FAQs Div

.FAQS H1
Colore: #ffe4bb;
Decisore del testo: sottolineare 2px Wavy;

IL ".FAQ H1"Viene indirizzato al file

Tag di FAQS DIV. La spiegazione delle proprietà applicate è descritta di seguito:

• • "colore"La proprietà imposta il colore del carattere.
  • "decorazione del testoLa proprietà "è impostata con il valore"sottolinea 2px wavy"Dove sottolinea la proprietà della decorazione del testo, 2px è la larghezza della linea e Wavy è lo stile.

Elemento dettagli di stile

dettagli
imbottitura: 5px;

L'elemento viene applicato con "imbottitura"Proprietà che applica lo spazio attorno al contenuto dell'elemento Div.

Elemento di riepilogo dello stile

riepilogo
imbottitura: 6px;
Font-size: 20px;
Colore: Whitesmoke;

L'elemento viene applicato con stili CSS descritti di seguito:

• • "imbottitura"Proprietà con valore"6px"Produrre spazio attorno al contenuto dell'elemento di riepilogo.
  • "dimensione del font"La proprietà imposta le dimensioni del carattere.
  • "coloreLa proprietà "applica il"fumo bianco"Colore al carattere.

Fornendo il codice sopra fornito, la nostra pagina web sarà così:

Si può osservare che un riepilogo di ciascuno dei punti indicati è stato associato con successo ad esso.

Conclusione

HTML ci consente di utilizzare il ""Elemento che visualizza l'intestazione che può visualizzare o nascondere i dettagli facendo clic. Questo elemento HTML può essere utilizzato per organizzare il contenuto e aumentare il contenuto complessivo della pagina Web. Questo articolo ha dimostrato con successo cos'è un tag di riepilogo HTML e come può essere inserito in un file HTML.