Come applicare il raggio del bordo in IE8 e sotto i browser IE8?

Question

Mi piacerebbe sapere come applicare border-radius a IE8 e sotto i browser IE8.

So che border-radius è una funzionalità HTML5 e IE8 non lo supporta.

Ho scoperto che utilizzando .htc possiamo ottenere questo risultato ma utilizzando htc sto riscontrando il problema dello sfondo nero.

Non riesco a risolvere questo problema.

Esiste un altro modo per applicare border-radius a IE8? Se è così, qualcuno può spiegarmi come?

Answer 1

Opzione 1

http://jquery.malsup.com/corner/

Opzione 2

http://code.google.com/p/curved-corner/downloads/detail?name=border-radius-demo.zip

Opzione 3

http://css3pie.com/

Opzione 4

http://www.netzgesta.de/corner/

Opzione 5

See this question

EDIT: Opzione 6

https://code.google.com/p/jquerycurvycorners/

Answer 2

PIE rende Internet Explorer 6-9 in grado di rendere alcuni dei più utili CSS3 caratteristiche decorazione

http://css3pie.com/

....................... .................................................. .......

Answer 3

Come la risposta detto sopra, PIE CSS rende le cose come border-radius e box -lavora il lavoro in IE6-IE8: http://css3pie.com/

Detto questo, ho ancora riscontrato che le cose sono un po 'instabili quando si utilizza PIE e ora si accetta solo che le persone che utilizzano i browser meno recenti non vedano angoli arrotondati e ombretti.

Answer 4

HTML:

<div id="myElement">Rounded Corner Box</div> 

CSS:

#myElement { 
    background: #EEE; 
    padding: 2em; 
    -moz-border-radius: 1em; 
    -webkit-border-radius: 1em; 
    border-radius: 1em; 
    behavior: url(PIE.htc); 
    border: 1px solid red; 

} 

PIE.Il file htc può essere scaricato da http://www.css3pie.com

Answer 5

In primo luogo per la precisione tecnica, border-radius non è una funzionalità HTML5, è una funzione CSS3.

Lo script migliore che ho trovato per il rendering delle ombre di casella & angoli arrotondati nelle versioni precedenti di IE è IE-CSS3. Traduce la sintassi CSS3 in VML (un linguaggio vettoriale specifico per IE come SVG) e li visualizza sullo schermo.

Funziona molto meglio su IE7-8 che su IE6, ma supporta anche IE6. Non ho pensato molto a PIE quando l'ho usato e ho scoperto che (come l'HTC) non era veramente costruito per essere funzionale.

Answer 6

La proprietà border-radius è supportata in IE9 +, Firefox 4+, Chrome, Safari 5+ e Opera, poiché è proprietà CSS3. così, si potrebbe usare css3pie

primo controllo questa demo in IE 8 e scaricarlo da here scrivere il vostro regola CSS come questo

#myAwesomeElement { 
    border: 1px solid #999; 
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px; 
    border-radius: 10px; 
    behavior: url(path/to/pie_files/PIE.htc); 
} 

nota: aggiunto behavior: url(path/to/pie_files/PIE.htc); nella regola di cui sopra. all'interno di url() è necessario specificare la posizione del file PIE.htc