Utilizzo dei commenti condizionali in HTML

Question

Sono relativamente nuovo allo sviluppo web e all'apprendimento continuamente. Di recente mi sono imbattuto in "Commenti condizionali" durante la visualizzazione del codice sorgente per diversi siti Web. Penso che ora capisco cosa fanno ma non sono sicuro di quando usarli.

Li ho visti utilizzati principalmente per l'implementazione di fogli di stile diversi quando si tratta di IE e vorresti sapere se questa è una buona pratica?

Nel qual caso se la risposta è 'Sì'. Quindi, quando si sviluppa un sito, è "luogo comune" utilizzare due fogli di stile separati per correggere i bug, ad esempio creare un foglio di stile per IE e uno per Firefox, Opera ecc.

Grazie in anticipo.

Answer 1

I commenti condizionali sono supportati solo da IE, per quanto ne so, e eseguono il downgrade con grazia nei browser che non li supportano (poiché sembrano un normale commento). Il consenso generale è che è OK utilizzare una funzione browser non standard se la si utilizza per combattere un altro browser non standard "funzionalità". (ovvero il supporto scadente per CSS in IE). Scoprirai quindi che è una soluzione molto comune per modificare i CSS.

Answer 2

La natura di Internet Explorer (versione 6 in particolare ) rende possibile che alcuni fogli di stile funzionino bene con IE, altri no. Ai fini di quelli che non lo fanno, è possibile utilizzare i commenti condizionali per avere il codice CSS che viene visualizzato solo per IE. Devo usarlo a causa di come Internet Explorer (mis) gestisce i menu a discesa CSS.

Per fare in modo che il sito web su cui sto lavorando esegua correttamente il rendering della funzione hover del menu a discesa, devo implementare il file crosshover.htc. Ecco il codice che devo usare:

     <!--[if IE]>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}
</style>
<![endif]-->
<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {
behavior: url(http://www.stannscatholicschool.com/csshover.htc);
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}

#menu a, #menu h2 {
font: 100% verdana, tahoma, helvetica, arial, sans-serif;
}

</style>
<![endif]-->

Se non lo faccio, il menu a discesa si divide e non può essere navigato in Internet Explorer 6.

Answer 3

Ho usato i commenti condizionali per rilevare se i visitatori del mio sito usano IE6 o inferiore. In tal caso, carico lo IE7.js script , che supera alcuni dei bug in questi browser più vecchi. C'è anche uno script per emulare il supporto per IE8.

Answer 4

Alcune persone usano anche commenti per aiutare a delineare alcune aree della pagina come piè di pagina, intestazione o contenuto principale (spesso nei modelli).

Tuttavia, se stai usando div e CSS (che sembra che tu sia) dovresti essere in grado di dire qual è il contenuto o quale area dell'HTML ti trovi negli ID DIV e negli stili CSS. Ricorda di usare nomi chiari e cerca di non abbreviarli solo per motivi di digitazione più semplice.

Se questo è un problema per te, Intellisense è una cosa meravigliosa e può aiutarci a aggirare cose del genere. In caso contrario, CTRL + C e CTRL + V è probabilmente la cosa migliore successiva :)

Answer 5

Questa è un'ottima pratica! La pagina di documentazione ufficiale dei commenti condizionali , contiene molti esempi e combinazioni di commenti condizionali, vale la pena leggerlo. La pagina afferma inoltre che:

I commenti condizionali rendono facile per gli sviluppatori sfruttare le funzionalità avanzate offerte da Microsoft Internet Explorer 5 e versioni successive, mentre scrivono pagine che eseguono il downgrade con grazia in browser meno capaci o vengono visualizzate correttamente in browser diversi da Windows Internet Explorer. I commenti condizionali sono il mezzo preferito per differenziare le regole CSS (Cascading Style Sheets) destinate a versioni specifiche di Internet Explorer.

Oggigiorno Internet Explorer è il browser meno capace , quindi è molto probabile che utilizzerai i commenti condizionali per fare l'esatto contrario, ovvero per sfruttare le funzionalità avanzate offerte da tutti gli altri browser, durante la scrittura di pagine che eseguono il downgrade con grazia in Microsoft Internet Explorer.

Puoi utilizzare i commenti condizionali per correggere stili CSS non supportati o per nascondere il codice da Internet Explorer, in questo modo:

<!--[if !IE]>-->
<script src="IE_will_never_see_this.js" type="text/javascript" charset="utf-8" ></script>
<!--<![endif]-->