Jak mogę usunąć obramowanie wokół obrazu bez źródła?

Question

Mam obraz i nie zdefiniowałem jeszcze źródła. Ma border:/

np <img src="" />

Jeśli dam mu źródła, granica odchodzi (ze względu na CSS: border:none).

Jak mogę usunąć ramkę wokół obrazu, gdy nie ma źródła?

Answer 1

Można nie jest domyślnie w przeglądarce, najlepiej po prostu dodaj w src lub nie znacznika obrazu, lub ustawić jego szerokość/wysokość do 0, chyba że dostępny jest src. Można również użyć przezroczystego obrazu jako elementu zastępczego.

Answer 2

Możesz go po prostu ukryć, dopóki nie dasz mu src.

img { 
height: 200px; 
width: 200px; 
visibility: hidden;  
}​ 

Albo dać mu 0 wielkość

img { 
height: 0; 
width: 0; 
}​ 

Answer 3

Co mogę zasugerować to miejsce w przypadku nieposiadania src = „” Usuń go i można

img { 
    display: none; 
} 


img[src] { 
    display: block; 
} 

lub jeśli wiesz jak adres URL zawiera pewne szczególne słowo, np http można zrobić:

img[src*="http"] { 
    display: block; 
} 

Answer 4

obraz o dane: URL atrybutu src

<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="> 

zależnie od wymaganej wsparcie przeglądarka yo u może również:

img[src=""] { 
    content:url("data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="); 
} 

Patrz: http://probablyprogramming.com/2009/03/15/the-tiniest-gif-ever

Answer 5

visibility: hidden; utrzymuje przestrzeń obrazu pusta. display: none; ukryć całkowicie obraz i nie ma zarezerwowane miejsce

Answer 6

Proponuję użyć text-indent: 100vw;

.logo { 
 
    text-indent: 100vw; 
 
}

<img class="logo" src="" alt="my logo" />

Answer 7

SRC z tagu img może być 404 Err. W tym przypadku można użyć postępuj jak:

div.menu_avatar { 
    width: 50px; 
    height: 50px; 
    overflow:hidden; 
} 
div.menu_avatar img{ 
    width:52px; 
    height:52px; 
    margin-left: -1px; 
    margin-top:-1px; 
} 

Answer 8

Wystarczy usunąć src="";) i będzie to znika tak po prostu.