Nwlapcug.com


Come rendere un DIV visibile in HTML

Come rendere un DIV visibile in HTML


Il tag < div > è uno degli elementi costitutivi fondamentali di qualsiasi sito Web. Un div può essere pensato come un contenitore, come una scatola che mantiene tutti i tuoi contenuti, pulite e ordinate, o una cartella è possibile presentare alcune informazioni in. Questo consente di logicamente ordinare il contenuto sul tuo sito Web e posizionarlo dove si desidera. Quando si inserisce un div in HTML il contenuto sarà visibile ma il div stesso sarà invisibile. Rendendolo visibile, è necessario utilizzare una piccola quantità di CSS.

Istruzioni

Definizione il div in HTML

1

Aprire il documento HTML nell'editor di testo ASCII preferito. Se non si dispone di un editor di testo, utilizzare il blocco note.

2

Individuare gli elementi che si desidera eseguire il wrapping in un div. Può trattarsi di testo o un'immagine. Il modo più rapido per trovare contenuti specifici è quello di fare una ricerca usando "Ctrl + f".

3

Inserire un div nel codice utilizzando il tag < div > di apertura e il tag di chiusura < / div >. Il codice dovrebbe risultare come questo:

< div >

I contenuti qui

< / div >

4

Dare il div un id. L'id può essere nulla, ma che è meglio tenerlo descrittivo, in modo si può capire il codice quando si arriva a modificarlo. L'id dovrebbe assomigliare a questo:

< div id = "wrapper" >

Rendere il div visibile in CSS

5

Aprire il documento CSS nel vostro comodo editor di testo ASCII. Se non si dispone di un editor di testo, utilizzare il blocco note.

6

Creare una nuova classe in questo documento utilizzando il seguente codice:

Wrapper () {

}

7

Dare il div un'altezza e una larghezza effettuando le seguenti operazioni:

Wrapper () {

height:100px;

width:100px;

}

8

Rendere visibile il div dandogli un bordo come segue:

Wrapper () {

border:1px solid black;

}

9

Per garantire il div e il suo contenuto sono visibili e non eredita gli stili da altrove, aggiungere la proprietà visible, come questo:

Wrapper () {

visibility: visible

}

Consigli & Avvertenze

  • È possibile nascondere il vostro div e il suo contenuto utilizzando "visibilità: nascosto".
  • Il vostro div deve avere contenuto o un'altezza specificata e larghezza siano visibili.
  • Garantire i documenti HTML e CSS sono collegati utilizzando < link rel = "stylesheet" type = "text/css" href="styles.css" / > all'interno dei tag < head >.