Per comprimere div e p dai CSS

StackOverflow https://stackoverflow.com/questions/1304009

  •  19-09-2019
  •  | 
  •  

Domanda

Come si può comprimere div e p -Elementi se sono vuote dal CSS in modo tale che i tag non vengono visualizzati per l'utente nel codice sorgente?

Questi elementi sono nel mio codice sorgente anche se sono vuote. Questo fa sì che i bug con il resto del sito.

ho eseguito questo senza successo 

div.unsuccessful,
div.unsuccessful p {
    visibility: collapse;                                                                                                                                                                                      
}

Questo mi suggerisce che si a quanto pare non si può fare una cosa del genere da CSS. Forse, è necessario un altro strumento come PHP.

È stato utile?

Soluzione

CSS non ha alcuna influenza sul codice HTML vero e proprio, quindi questo non può essere fatto. Nella (imminente) CSS3, li si potrebbe smettere di essere reso utilizzando il :empty pseudo-classe: 

div:empty {
    display: none;
}

Questo è, naturalmente non è la stessa cosa, ma sarebbe probabilmente risolvere i problemi si hanno .. se solo i browser supportati in realtà, cosa che non lo fanno, ancora.

L'opzione migliore è quella di rimuoverli al server, utilizzando un linguaggio di scripting come PHP. Suppongo che potrebbero farlo lato client con JavaScript, ma questa è una soluzione orribile, IMO.

Detto questo, quali sono i problemi che si stanno avendo con questi tag vuote? Perché sono lì, in primo luogo? Mi sembra che qualche riprogettazione è in ordine, per evitare che i tag inutili vengano generati in primo luogo.

Inoltre, fare attenzione. tag vuoti non sono sempre prive di significato. Infatti, togliendo ogni <div> vuoto là fuori può essere considerato nocivo.

Altri suggerimenti

Sì, se si desidera impedire loro di essere in la fonte , è necessario fare le opportune considerazioni nel codice del server. In alternativa, è anche possibile impostare il codice HTML in JavaScript, ma non è l'approccio raccomandato per questo problema, probabilmente. È possibile, come dire un po 'di più, però, su quello che stai cercando di fare.

proprietà Visibility ha lo scopo di impostare se il contenuto dell'oggetto viene visualizzato o meno. Esso non rimuoverà l'elemento dall'interno del DOM.

  

crollare Nuovo per Internet di Windows   Explorer 8

     

Utilizzato in tabelle per rimuovere righe e colonne; per tutti gli altri elementi, proprio come nascosto.

Anche perché vuoi fare questo? 

div { display: none; }

rimuove un elemento completamente dalla pagina.

Sarà ancora presentarsi nella vostra il codice sorgente , non importa quello che fai con i CSS. Il browser combina il codice HTML e le direttive CSS in una pagina visualizzabile, la fonte originale non viene modificato. CSS può influenzare solo la visualizzazione degli elementi, ma non può modificare gli elementi. Per rimuovere gli elementi in realtà dal DOM avrete bisogno di Javascript (o non mettere gli elementi lì, in primo luogo).

Sì, si dovrà utilizzare l'elaborazione lato server per mostrare o non mostrare un po 'di codice per l'utente: 

if ($showAdminLink) {
    echo "<p><a href=\"admin.php\">Admin panel</a></p>";
}

Non importa quali trucchi si prova, nulla di fatto sul lato client (HTML, Javascript, CSS) può essere modificato e giocato con.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top