Nwlapcug.com


Come rendere efficace la CSS per IE

Internet Explorer ha una reputazione tra gli sviluppatori Web per essere difficile da lavorare a causa di molti bug di CSS. Microsoft è anche più lento aggiungere nuove funzionalità, soprattutto gli effetti visivi proprietà CSS livello 3 possono creare. Nel corso degli anni, molte incisioni e gli script sono stati concepiti per superare le limitazioni del browser IE, ma maggior parte degli sviluppatori ha cominciato a cipiglio sul goffa soluzioni alternative. Un insieme di tecniche che vanno dalla correzione di base ad una sofisticata soluzione JavaScript renderà più facile per voi per rendere i CSS funziona come dovrebbe in IE.

Istruzioni

1

Utilizzare una dichiarazione di tipo di documento appropriato. Questo risolverà molti bug nelle versioni precedenti di Internet Explorer. Dal momento che HTML5 è venuto fuori, il tipo di documento o "doctype" è semplice e facile da ricordare:

<! doctype HTML >

Questa è la prima riga nel codice HTML di una pagina Web. Anche se la pagina Web include già una dichiarazione di tipo di documento, è possibile sostituire qualsiasi versione precedente con questo uno per ridurre la confusione sul fatto che la pagina è transitional o strict.

2

Aggiungere un foglio di stile "reset" al vostro arsenale di sviluppo Web. Si tratta di un tipo di foglio di stile che rimuove lo stile che browser applicano alle pagine Web, quindi non sarà necessario chiedersi quali valori di margine che Internet Explorer utilizza contro i valori utilizzati da Firefox predefinito. Il reset più popolare è ancora il Eric Meyers' Azzera. Ottenere il codice di reset dal sito di Meyers al meyerweb.com/eric/tools/css/reset/ e salvarlo nella stessa cartella dove salvato la pagina Web. Aggiungere questa riga sotto il tag "< title >" nella tua pagina Web per aggiungere il reset:

< link rel = "stylesheet" href="reset.css" >

3

Utilizzare commenti condizionali per aggiungere nei fogli di stile, solo quando il visitatore utilizza una specifica versione di Internet Explorer:

<!-[se IE 6] >
< link rel = "stylesheet" href="ie6.css" >
<! [endif]-->

All'interno del foglio di stile solo IE, aggiungere CSS che corregge bug conosciuti per IE. Due grossi bug di guardare fuori per includono doppia casella errato modello calcoli e margini. Il primo bug cause margins Double up invece di sovrapposizione. Il secondo bug causa IE calcolare il riempimento e bordi come parte della larghezza del contenuto per qualsiasi elemento, ad esempio un div. margini di Tweaking e larghezze per i CSS solo IE risolverà questi.

4

Installare il JavaScript "Modernizr" alla tua pagina Web. Questo script scopre quello che browser di un utente e non è supportata e quindi aggiunge le classi per il tag "< body >". Scaricare lo script e salvarlo nella stessa cartella dove si trova la tua pagina Web. Aggiungerlo al codice HTML sopra il tag di chiusura "< / head >" utilizzando il tag "< script >":

< script src="path/to/modernizr.js" >< / script >

Segui la documentazione sul sito Modernizr per scoprire quali caratteristiche esso annusa fuori e come utilizzare le classi.