Ho appena iniziato il mio primo vero sito Web HTML per un amico, e mi chiedevo come avrei potuto ottenere il sito Web per il montaggio automatico della pagina?Come posso ottenere una pagina per adattarsi automaticamente a una finestra?
È un design del paesaggio che non richiede scorrimento.
è possibile utilizzare i CSS per farlo, ad esempio
<style>
html{
width:100%;
height:100%;
}
body{
width:100%;
height:100%;
background-color:#DDD;
}
</style>
il colore di sfondo è solo per mostrarti – user1825286
È necessario impostare body e html-position:fixed;, e quindi impostare right:, left:, top:, e bottom:-0;. In questo modo, anche se il contenuto fuoriesca, non si estenderà oltre i limiti della finestra.
Ad esempio:
<html>
<body>
<div id="wrapper"></div>
</body>
</html>
CSS:
html, body, {
position:fixed;
top:0;
bottom:0;
left:0;
right:0;
}
Caveat: Utilizzando questo metodo, se l'utente rende la loro finestra più piccola, il contenuto sarà tagliato.
Se è in un paesaggio, allora avrai bisogno di più larghezza e meno altezza! Questo è quello che hanno tutti i siti web.
Consente di eseguire prima un base, quindi il resto!
Il CSS di base:
Con i CSS è possibile fare questo,
#body {
width: 100%;
height: 100%;
}
Qui si utilizza un div con id corpo, come:
<body>
<div id="body>
all the text would go here!
</div>
</body>
Poi si può avere una pagina web con altezza 100% e larghezza.
Cosa succede se tenta di ridimensionare la finestra?
I problemi vengono visualizzati, cosa succede se tenta di ridimensionare la finestra? Quindi tutti gli elementi all'interno di #body proverebbero a rovinare l'interfaccia utente. Per questo si può scrivere questo:
#body {
height: 100%;
width: 100%;
}
e basta aggiungere min-heightmax-heightmin-width e max-width.
In questo modo, l'elemento della pagina rimarrebbe nel punto in cui si trovavano nella pagina di caricamento.
Utilizzando JavaScript:
Utilizzando JavaScript, è possibile controllare l'interfaccia utente, utilizzare jQuery come:
$('#body').css('min-height', '100%');
E tutte le altre proprietà CSS rimanenti, e JS si prenderà cura di dell'interfaccia utente quando l'utente sta provando a ridimensionare la finestra.
Come non aggiungere scorrere alla pagina web:
Se non si sta tentando di aggiungere una pergamena, quindi è possibile utilizzare questo JS
$('#body').css('min-height', screen.height); // or anyother like window.height
In questo modo, il documento otterrà una nuova altezza ogni volta che l'utente caricherà la pagina.
La seconda opzione è migliore, perché quando gli utenti avrebbero diverse risoluzioni dello schermo vorrebbe un foglio CSS o stile creato per il proprio schermo. Non per gli altri!
Suggerimento: Quindi provare a utilizzare JS per trovare la dimensione dello schermo corrente e modificare la pagina! :)
@JoshC Siamo tutti studenti. Cerca di frenare il sarcasmo. – fred02138
Riapri questa domanda, è utile perché chiuderla? –
in verità .. c'è molto sarcasmo qui [stack overflow] .. quando tutto quello che stai cercando è un po 'di assistenza ... per un po' ho semplicemente ignorato questo sito ... – albruno