Jak usunąć obramowanie wokół obrazu w css?

Question

Próbuję wyświetlić zakres, gdy kursor myszy znajduje się na ikonie pomocy.

Działa, ale mimo to nie zdołam usunąć granicy wokół ikony.

Moje CSS:

.info{ 
    position:absolute; 
    border:none; 
} 

a.info{ 
    position:absolute; 
    z-index:24; 
    background:none; 
    color:#000; 
    text-decoration:none 
} 

a.info:hover{ 
    z-index:25; 
    background-color:#FFF; 
    cursor:help; 
} 

a.info span{ 
    display: none 
} 

a.info:hover span{ 
    display:block; 
    position:absolute; 
    cursor:help; 
    bottom:0px; 
    left:26px; 
    width:150px; 
    padding:4px; 
} 

cd

Answer 1

Spróbuj tego:

img{border:0;} 

Można również limitate zakres i tylko usunąć obramowanie na niektórych obrazów w ten sposób:

.myClass img{border:0;} 

Więcej informacji Informacje na temat właściwości css granicznej można znaleźć pod adresem here.

Edytuj: Zmieniono granicę z 0px na 0. Jak wyjaśniono w komentarzach, px jest zbędny dla jednostki 0.

Answer 2

Jaką klasę posiadasz na etykiecie graficznej?

Spróbuj

<img src="/images/myimage.jpg" style="border:none;" alt="my image" /> 

Answer 3

wierzę trzeba dodać border: none styl do elementu ikon, jak również.

Answer 4

może dodać border:none się pod a.info:hover span lub text-decoration:none

Answer 5

Zwykle używam tego na górze pliku CSS.

img { 
    border: none; 
} 

Answer 6

dziękuję za odpowiedzi,

granica jest "zniszczyć" (przepraszam za mój angielski) pod IE, ale pod FF, to jeszcze raz. Więc próbuję tego:

.clearBorder {border: none;} i dodaję tę klasę do img, a ona rządzi.

Answer 7

to dobry pomysł, aby użyć resetowania CSS. dodać to na górze pliku CSS

img, a {border:none, outline: none;} 

nadzieję, że to pomaga

Answer 8

Zdaję sobie sprawę, że jest to bardzo stary post, ale napotkał podobny problem, w którym mój wyświetlany obraz zawsze obramowanie wokół niego . Próbowałem wypełnić okno przeglądarki jednym obrazem. Dodawanie stylów takich jak border: none; nie usunęli granicy, a marża nie była równa: 0; lub dopełnienie: 0; lub dowolną kombinację tych trzech.

Jednak dodanie pozycji: bezwzględne, góra: 0, lewo: 0; naprawiono problem.

Oryginalny post powyżej ma pozycję: bezwzględna; ale nie ma góry: 0; lewo: 0; i to było dodanie domyślnej granicy na mojej stronie.

Aby zilustrować rozwiązania, ma białą obwódkę (a dokładniej, ma górnej i lewej offset):

<img src="filename.jpg" 
style="width:100%;height:100%;position:absolute;"> 

nie posiada obramowanie:

<img src="filename.jpg" 
style="width:100%;height:100%;position:absolute;top:0;left:0;"> 

Mam nadzieję, że Pomaga to w odnalezieniu tego postu, aby rozwiązać podobny problem.

Answer 9

Kolejna rzecz - należy pamiętać, że jeśli masz z atrybutem pustysrc, to żadna z tych propozycji będzie działać, obramowanie będzie wciąż pokazany.

<img src="" style="width:30px;height:30px;"> 

Answer 10

img trzeba src używać granica jest zmywacz, i nie wiedzieć dlaczego css jest szalony

data:image/gif;base64,R0lGODlhAQABAPcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAP8ALAAAAAABAAEAAAgEAP8FBAA7 

Więc spróbuj przykład z SRC:

img.logo { 
 
\t width: 200px; 
 
    height: 50px; 
 
\t background: url(http://cdn.sstatic.net/Sites/stackoverflow/img/sprites.svg) no-repeat top left; 
 
}

<img class="logo" src="data:image/gif;base64,R0lGODlhAQABAPcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAP8ALAAAAAABAAEAAAgEAP8FBAA7">

Więc spróbuj przykład bez SRC:

img.logo { 
 
\t width: 200px; 
 
    height: 50px; 
 
\t background: url(http://cdn.sstatic.net/Sites/stackoverflow/img/sprites.svg) no-repeat top left; 
 
}

<img class="logo">

lol ... css szalony! dobra zabawa

Answer 11

Oto jak pozbyłem kopalni:

.main .row .thumbnail { 
    display: inline-block; 
    border: 0px; 
    background-color: transparent; 
} 

Answer 12

<img id="instapic01" class="samples" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"/>