Mengapa Imej Masih Mempunyai Sempadan dalam Chrome dan IE9, Walaupun dengan \'border: none;\'?

Teknik Penindasan Sempadan Chrome dan IE9

Mengalih keluar sempadan yang tidak sedap dipandang yang berterusan di sekeliling imej dalam Chrome dan IE9 boleh menjadi tugas yang mengecewakan. Walaupun menetapkan sifat sempadan kepada "tiada", pelayar ini berdegil mengekalkan garisan nipis.

Potensi Punca dan Penyelesaian:

• Pepijat Chrome: Chrome mengabaikan "border:none;" gaya, terutamanya untuk imej dengan dimensi tertentu. Untuk memintas perkara ini, tipu Chrome supaya tidak melihat kehadiran imej dengan menetapkan lebar dan ketinggian sifar, ditambah dengan nilai padding yang tepat untuk menampung saiz imej yang diingini.
• Gelagat IE9: IE9 menambah piksel- sempadan pilihan nipis di sekeliling imej apabila imej diklik. Untuk menghapuskan perkara ini, lumpuhkan sifat "pilihan pengguna".

Contoh Pelaksanaan:

CSS untuk Chrome Bug:

<code class="css">#dlbutn {
    display:block;
    width:0px;
    height:0px;
    outline:none;
    padding:43px 51px 43px 51px;
    margin:0 auto 5px auto;
    background-image:url(/images/download-button-102x86.png);
    background-repeat:no-repeat;
}</code>

CSS untuk Sempadan Pemilihan IE9:

<code class="css">img {
    -ms-user-select:none;
    user-select:none;
}</code>

Petua Tambahan:

• Pastikan imej adalah tidak dibalut dengan mana-mana elemen lain dengan jidar.
• Semak awalan vendor yang mungkin mempengaruhi penampilan jidar.
• Cuba lumpuhkan pecutan perkakasan buat sementara waktu untuk melihat sama ada ia mempengaruhi gelagat sempadan.

Atas ialah kandungan terperinci Mengapa Imej Masih Mempunyai Sempadan dalam Chrome dan IE9, Walaupun dengan \'border: none;\'?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!