Come correggere i CSS per Internet Explorer 7

November 16

Quando si progetta un sito web, è possibile notare che la pagina web appare leggermente diverso in tutti i browser. Questo perché ogni browser legge il codice diverso. Le differenze hanno spesso a che fare con i fogli di stile del sito (CSS). Codifica CSS per Internet Explorer 7 può essere un mal di testa, perché questo browser ha così tanti problemi di interpretazione del codice CSS. Per questo motivo, fare un sito lo stesso aspetto in Internet Explorer 7 come avviene in altri browser prende alcuni trucchi.

istruzione

1 Tenere CSS 3 dal vostro fogli di stile. Mentre gli altri browser supportano l'ultima versione di CSS, Internet Explorer 7 non supporta gran parte di essa. E 'meglio per mantenere il codice CSS 3 dei tuoi siti web fino a quando Internet Explorer ha un migliore supporto per esso.

2 Utilizzare "text-align" Quando si centra tag divisione. tag Division, più comunemente noto come "div", sezioni separate di codice HTML. In altri browser c'è un trucco per div centrare nel CSS, che sembra qualcosa di simile:

.divtag {

margin-left: auto;

}

Tuttavia, questo non funziona in Internet Explorer 7. Se si vuole centrare un div, è necessario aggiungere il seguente codice al CSS:

html, body {

text-align: center;

}

3 Risolvere i problemi di margine. i margini di default di Internet Explorer sono diversi da altri browser, che rendono i layout del sito web guardano strano. Incollare il codice seguente tra i tag <head> e </ head> nel codice HTML.

<! - [If IE]>

<Style>

.marginfix {

margin: 5px;

padding: 10px;

}

</ Style>

<! [EndIf] ->

Il <! - [If IE]> tag mostra questo codice a solo Internet Explorer e raddrizza le questioni di margine fuori.

4 Regolare scomparendo immagini di sfondo. A volte Internet Explorer 7 non ripeterà le immagini di sfondo correttamente, rendendo il fondo si ferma a metà pagina. L'aggiunta di "position: relative" per le correzioni CSS questo. Il codice simile a questa:

.scatola {

fondo: url ( 'background.jpg');

position: relative;

}

5 Evitare l'hack selettore di bambino; non funzionerà. In passato, se si ha problemi facendo un lavoro CSS per Internet Explorer, è possibile utilizzare un codice come questo:

html> body {.divexample

width: 100px;

altezza: 100px;

padding: 5px;

background: # 000000;

}

Internet Explorer 6 e di seguito non capisco "html> body"; così, quando Internet Explorer vede che il codice, salta esso. Questo permette di nascondere il codice da tali browser. Tuttavia, questo funziona più in Internet Explorer 7; quindi, non utilizzare questo codice.

6 Utilizzare il metodo "link rel" di collegamento CSS ad una pagina web piuttosto che il metodo di "importazione". Ci sono due modi per collegare un foglio di stile esterno a un documento HTML. Uno è il codice di importazione, che sembra qualcosa di simile:

<Style type = "text / css"> @import "stylesheet.css"; </ style>

Questo metodo è caduto in disgrazia, perché Internet Explorer non sempre capisce. Il seguente metodo è molto più affidabile:

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