У меня есть изображение, и я еще не определил источник. Он имеет границу:/
например: <img src="" />
Если я даю ему источник, граница уходит (из-за css: border:none
).
Как удалить границу вокруг изображения, когда у него нет источника?
У меня есть изображение, и я еще не определил источник. Он имеет границу:/
например: <img src="" />
Если я даю ему источник, граница уходит (из-за css: border:none
).
Как удалить границу вокруг изображения, когда у него нет источника?
<img src="" width=50 height=50>
То, что я мог бы предложить, в случае отсутствия src="" удалить его, и вы можете
img {
display: none;
}
img[src] {
display: block;
}
или если вы знаете, что в URL-адресе содержится какое-то специальное слово, например http, которое вы можете сделать:
img[src*="http"] {
display: block;
}
Изображение с данными: атрибут URL src
<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==">
В зависимости от вашей поддержки в браузере вы также можете:
img[src=""] {
content:url("data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==");
}
Смотрите: http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever
Я бы предложил использовать text-indent: 100vw;
.logo {
text-indent: 100vw;
}
<img class="logo" src="" alt="my logo" />
Вы можете просто скрыть его, пока не получите его src.
img {
height: 200px;
width: 200px;
visibility: hidden;
}
Или дайте 0 размер
img {
height: 0;
width: 0;
}
visibility: hidden;
сохраняет пространство изображения пустым.
display: none;
полностью спрятать изображение и зарезервированное пространство
src вашего тега img может быть 404 Err. В этом случае вы можете использовать следующую команду:
div.menu_avatar {
width: 50px;
height: 50px;
overflow:hidden;
}
div.menu_avatar img{
width:52px;
height:52px;
margin-left: -1px;
margin-top:-1px;
}
Использовать атрибут alt: указывает альтернативный текст для изображения, если изображение не может быть отображено. Атрибут alt предоставляет альтернативную информацию для изображения, если пользователь по какой-либо причине не может его просмотреть.
Если вы не хотите отображать альтернативный текст, если изображение не загружено, тогда оставьте альтернативный атрибут пустым
img {
width:50px;
height:50px;
}
<img src="kansdkans" alt=" " />
Просто удалите src=""
;), и он исчезнет именно так.