Bagaimana untuk Alih Keluar Sempadan Imej Berterusan dalam Chrome dan IE9?

Mengalih keluar Sempadan Imej Sukar dalam Chrome/IE9

Apabila memaparkan imej dalam Chrome atau IE9, anda mungkin menghadapi sempadan nipis yang berterusan walaupun ditetapkan "outline: none" dan "border: none" dalam CSS. Isu ini timbul disebabkan oleh tingkah laku Chrome pelik yang mengatasi "sempadan: tiada."

Untuk mengatasinya, anda boleh menggunakan teknik bijak yang melibatkan penetapan lebar dan ketinggian imej kepada 0px sambil mengalasnya dengan nilai piksel yang sepadan kepada saiz butang yang dikehendaki. Pertimbangkan contoh CSS berikut:

<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>

Dengan memperdaya Chrome untuk mempercayai tiada kandungan yang boleh dilihat pada dimensi ini, anda menghapuskan sempadan dengan berkesan. Teknik ini memastikan keserasian merentas pelbagai penyemak imbas dan membolehkan anda memaparkan imej tanpa sempadan yang tidak sedap dipandang dalam Chrome.

Atas ialah kandungan terperinci Bagaimana untuk Alih Keluar Sempadan Imej Berterusan dalam Chrome dan IE9?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!