2017-02-09 27 views
1

У меня эти маленькие синие линии под и над 2 изображениями. Я попытался применить style="border: 0;", но он не работал. Также попытался применить css border:0px, outline:0px в файле css. но это тоже не работает.Маленькие синие линии под изображением и над изображением

Я предполагаю, что это ссылки или что-то в этом роде. Кто-нибудь может помочь мне удалить эти маленькие синие линии?

.kategorien1{ 
 
    margin-bottom: 50px; 
 
    margin-left: 75px; 
 
    margin-right: -35px; 
 
    box-shadow: 0px 0px 3px 0px black; 
 
    transition-property: all; 
 
    transition-duration: 400ms; 
 
} 
 
.kategorien2{ 
 
    margin-bottom: 80px; 
 
    margin-left: 300px; 
 
    box-shadow: 0px 0px 3px 0px black; 
 
    transition-property: all; 
 
    transition-duration: 400ms; 
 
}
<!DOCTYPE html> 
 
<html= lang=de> 
 
<head> 
 
<link href="style.css" rel= "stylesheet" type="text/css"> 
 
<meta charset="utf-8"> 
 
<title>Handgefertigte Armbänder online shoppen bei handform</title>  
 
</head> 
 

 

 
<body> 
 
<!--BILDER UNTERKATEGORIEN--> 
 
<a href="damem-lederimitat.html"> 
 
<img class="kategorien1" src="Lederimitat.jpeg" width="40%" style="border: 0;"> 
 
</a>  
 
<a href="damem-armreifen.html"> 
 
<img class="kategorien1" src="armreifen.jpeg" width="40%" style="border: 0;"> 
 
</a> 
 
<a href="damem-perlenarmbänder.html"> 
 
<img class="kategorien1" src="Perlenarmb%C3%A4nder.jpeg" width="40%" style="border: 0;"> 
 
</a> 
 
<a href="damem-verschiedene-armbänder.html"> 
 
<img class="kategorien1" src="verschiedene_b%C3%A4nder.jpeg" width="40%" style="border: 0;"> 
 
</a> 
 
<a href="damem-verschiedene-armbänder.html"> 
 
<img class="kategorien2" src="M%C3%A4nnerarmb%C3%A4nder.jpeg" width="40%" style="border: 0;"> 
 
</a> 
 

 
</body> 
 
    
 

 
</html>

ответ

1

Это из a тегов, как в синем подчеркиванием с гиперссылкой. Добавьте это в CSS, чтобы удалить их:

a { 
    text-decoration: none; 
} 

Чтобы покрыть себя полностью, это может быть хорошей идеей, чтобы применить это к обоим состояниям тега (вы знаете, как она идет фиолетовый раз щелкнул?), Так что попробуйте это css:

a, a:visited { 
    text-decoration: none; 
} 

Что бы это ни было, удалите подчеркивание со всех ссылок на вашей странице. Так что это может быть хорошей идеей, чтобы создать класс и добавить его к ссылкам вы не хотите, подчеркнутый, например:

a.no-underline, 
 
a.no-underline:visited { 
 
    text-decoration: none; 
 
}
<a class="no-underline" href="#">This isn't underlined</a> 
 
<a href="#">But this is!</a>

+0

Спасибо! Это был быстрый ответ. – Jahrens

+0

Это то, за что СОСТОИТ - если вы согласитесь с ответом, я был бы благодарен :) –

0

Вы оформления текста на вашем теге.

a{text-decoration: none;} 

Это избавится от него. Просто используйте лучший селектор, как указано выше, удалит все подчеркивания для ссылок.

0

При использовании изображений в качестве браузера ссылок по умолчанию применяется css. чтобы удалить его, вы должны удалить все свойства <a> по умолчанию, как:

a{ 
text-decoration:none; 
} 

или присвоить отдельный класс для <a>, а затем Deine свойства ..!

0

Просто используйте следующий CSS для этого

img, a, a:focus { 
    outline: none; 
} 
a, a:hover { 
    text-decoration: none; 
}