Come rendere un div adatto alle dimensioni della finestra?

In sostanza, sto cercando di emulare la prima pagina di questo tema: http://blackrockdigital.github.io/startbootstrap-grayscale/

Voglio fare in modo che la prima sezione occupi l’intero schermo e facendo clic sul pulsante scorrerà verso il basso fino alle altre pagine del sito (aggiungerò il pulsante in un secondo momento. Tuttavia, finisco con lo spazio bianco, non importa quale Ho provato a giocare con la percentuale del div nel css, ma non sembrava fare nulla, voglio solo che lo sfondo nero si estenda fino alla fine della finestra senza una barra di scorrimento, non importa il dimensione dello schermo.

Il codice può essere trovato qui: http://codepen.io/pwatrous/pen/qZeaog

body { width: 100%; height: 100%; } html { height: 100%; } h1 { margin-top: 0; padding-top: 10%; } .container-fluid { padding: 0px; } .section1 { background-color: #000000; height: 100% } .title { font-family: Quicksand; color: #FFFFFF; } #name { font-size: 5em; } #info { font-size: 3em; padding-bottom: 4%; } #bio { font-size: 2em; padding-bottom: 10%; margin-left: 5%; margin-right: 5%; } .fa-chevron-circle-down { color: #FFFFFF; padding-bottom: 4%; } 

Grazie!

Per fare in modo che div si adatti all’intero schermo, prova questo:

 body { margin: 0; } .my_fullscreen_div { width: 100vw; height: 100vh; } 

Metodo 1:

Prova ad aggiungere un colore di sfondo nel corpo.

 body { background-color:black; } 

Metodo 2:

HTML: posiziona la sezione 2 div all’interno della sezione 1 div

 

Patrick Watrous

Learn. Implement. Innovate.

The ability to dream up an idea and then recreate it on a computer has always been something that has caused me immense satisfaction. Due to this, I'm pursuing a bachelor's degree at Northeastern University in computer science and business. I'm interested in all facets of design, from Bootstrap to Java. Take a look at my website and see what i've been up to!

Lorem ipsum dolor sit amet,.....