Maison > Article > interface Web > Explication détaillée de la façon de supprimer la bordure grise lorsque img[src=''] img n'a pas de chemin
img[src=""] balise imgSolution pour supprimer la bordure grise sans chemin
1.JsMéthode de solution
<html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <img src="error.jpg" onerror="whenError(this)"> </body> <script> function whenError(a){ a.onerror=null; a.src='path_default.jpg'; console.log('图片出错的时候调用默认的图片'); } </script> </html>
2.Positionnement absoluFocus sur la solution
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>absolute聚焦解决方案</title> </head> <body> <p class="container-img"> <img class="common-icon login-icon" src="" width="38" height="38"> </p> </body> <style type="text/css"> .container-img { position: relative; display: inline-block; width: 36px; height: 36px; overflow: hidden; } .container-img img { position: absolute; top: -1px; right: -1px; background: url(img/common-icon.png) no-repeat; background-position: 0px 1px; } </style> </html>
3.margeFocus sur la solution
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>margin聚焦解决方案</title> </head> <body> <p class="container-img"> <img class="common-icon login-icon" src="" width="38" height="38"> </p> </body> <style type="text/css"> .container-img { display: inline-block; width: 36px; height: 36px; overflow: hidden; } .common-icon { display: inline-block; background: url(img/common-icon.png) no-repeat; background-position: 0px 1px; margin: -1px; } </style> </html>
4.css caché
img[src=""]{ opacity: 0; }
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!