Betulkan pepijat menggunakan limpahan atribut CSS di bawah pertukaran IE

Betulkan pepijat menggunakan limpahan atribut CSS di bawah pertukaran IE_Experience

WBOY

Lepaskan： 2016-05-16 12:06:16

asal

1646 orang telah melayarinya

Kami ingin mencipta fail HTML ujian Berikut ialah coretan kod utama

Salin kod Kod adalah sebagai berikut:

" rel="lesen">Patuhi hak cipta saya                                                                                               lesen" >Patuhi hak cipta saya
                                                                                                                                                            Patuhi hak cipta saya


<< /div>

Dalam kod di atas saya akan menggunakan CSS berikut

Salin kod Kod adalah seperti berikut:

div{

 lebar: 60%; 
} 

pra{ 
 limpahan : auto ; fff0f5 ; 
 margin : 1.6em 0 ; 
 padding : 0 1.6em ; 
} 


Paparan kod di atas boleh diramal. 

Tetapi dalam IE6, tiada kesan limpahan boleh dipaparkan

Rajah 1 Kesan di bawah IE6

IE6 overflow bug Paparan dalam IE7 juga sedikit berbeza, dengan bar skrol kanan yang menjengkelkan

Rajah 2 Kesan di bawah IE7

IE7 overflow bug Pepijat dalam IE6 boleh diselesaikan dengan menambah lebar pada blok yang mengandungi, iaitu,

Salin kod Kod adalah seperti berikut: pra{

limpahan : auto ;

 warna latar : #fff0f5 ; 
 margin : 1.6em 0 ; 
 lebar : 90% ; 
} 


Pada masa ini, bar skrol IE6 keluar, tetapi ia berkelakuan sama seperti IE7, dengan bar skrol kanan tambahan. 

Sebab untuk bar skrol kanan tambahan ialah IE sentiasa menambah bar skrol bawah di dalam jumlah ketinggian elemen Ini menjadikan sebahagian daripada ketinggian elemen diduduki oleh bar skrol bawah dan tidak boleh sepenuhnya dipaparkan, jadi IE Bar skrol di sebelah kanan ditambah secara automatik supaya kandungan elemen yang disekat boleh dilihat selepas menatal. 

Akhir sekali, untuk mengalih keluar bar skrol di sebelah kanan IE, kami menambah CSS berikut pada blok yang mengandungi

Salin kod

Kod Seperti berikut: pra{ limpahan : auto ;

warna latar : #fff0f5 ;

 margin : 1.6em 0 ; > pelapik : 0 1.6em ; 
 lebar: 90%; 
 limpahan-y: tersembunyi; seperti dalam Firefox, Opera dan Safari. 

Dalam aplikasi praktikal, kesan ini boleh digunakan pada semua elemen format tetap (biasanya unsur pra), selalunya blok kod. 