La sintassi per evitare che un display in formato HTML

August 28

La sintassi per evitare che un display in formato HTML


Gli sviluppatori Web possono scegliere di nascondere gli elementi della pagina utilizzando una combinazione di codice HTML e Cascading Style Sheet. Per utilizzare questa tecnica, una pagina deve includere elementi che possono essere identificati all'interno del codice CSS associato al sito. Le proprietà CSS per la visualizzazione e la visibilità possono entrambi nascondere elementi HTML, ma lo fanno in modi leggermente diversi. Gli sviluppatori hanno bisogno di decidere come vogliono l'elemento nascosto incidere sugli elementi visibili rimanenti all'interno di una pagina quando si sceglie una tecnica.

CSS

Un sito web può implementare stile visivo utilizzando uno o più sezioni di codice CSS. Gli sviluppatori possono includere questo codice all'interno della pagina Web di markup, o all'interno di un file separato che è collegato alla all'interno della sezione head pagina come segue:

<Link rel = "stylesheet" type = "text / css" href = "mypagestyle.css" />

Questo codice collega un file salvato come "mypagestyle.css", che viene memorizzato nella stessa directory della pagina stessa. All'interno del file CSS, gli sviluppatori possono includere tutte le proprietà di stile che piace, che determinano l'aspetto e il layout degli elementi del markup HTML.

Identifiers

codice CSS utilizza identificatori per lo stile particolari elementi HTML. Il seguente codice HTML di esempio illustra la creazione di un elemento con un attributo di classe:

<Div class = "nascondere"> Ecco alcune parole per nascondere </ div>

All'interno del codice CSS associato a questa pagina, la seguente sintassi identifica eventuali elementi con l'attributo class specificato:

.nascondere {

/ Dichiarazioni CSS qui /

}

Per identificare solo gli elementi di tipo "div" con l'attributo, CSS può utilizzare il seguente codice:

div.hide {

/ Dichiarazioni CSS qui /

}

All'interno di questa sezione di codice CSS, uno sviluppatore può includere qualsiasi proprietà styling necessarie, compresa nascondere l'elemento se richiesto.

Display

La proprietà CSS display può prendere un certo numero di valori possibili. Il valore nessuno dice al browser di non visualizzare l'elemento in questione a tutti. Il seguente codice di esempio CSS illustra questa tecnica:

display: none;

Qualsiasi elemento che questo codice si applica a non apparirà all'interno del browser quando l'utente visualizza la pagina. La pagina renderà come se gli elementi nascosti non sono lì, con altri elementi che occupano lo spazio che gli elementi nascosti potrebbero altrimenti sono apparsi all'interno.

Visibilità

La proprietà di visibilità nei CSS nasconde anche elementi, ma senza intaccare il layout di pagina. Questo significa che quando la visibilità è impostato su "nascosto" una pagina sarà ancora rispecchiare il settore che gli elementi nascosti avrebbero occupato se fossero lì. Il codice CSS di seguito viene illustrato utilizzando la proprietà di visibilità:

visibility: hidden;

Questa proprietà è preferibile che il contenuto nascosto sta per essere reso visibile ad un certo punto, mentre l'utente visualizza la pagina. Alcuni sviluppatori implementare effetti come questa che utilizzano funzioni JavaScript. Se un elemento precedentemente nascosto diventa visibile quando la proprietà display è stato utilizzato, il layout di pagina dovrà adattarsi ad ospitare esso, che può rendere elementi visibili saltare intorno. Usando la proprietà di visibilità evita questo problema.