2012-02-19 4 views
1

링크가있는 이미지가 있습니다. 클릭하면 어딘가에 나를 보내고 그 페이지로 돌아가려면 이미지를 클릭하면 그 주변에 1px 점선의 파란색 테두리가 있습니다. 또한, 클릭하면 그 경계가 빨간색으로 유지됩니다. 이것은 정말보기가 좋지 않아 그 경계를 지우는 방법을 찾을 수 없습니다. 내가a : 방문한 {text decoration : none}이 (가) Firefox에서 작동하지 않습니다.

a:visited {text-decoration: none} 
a:active {text-decoration: none} 

와 함께 시도했다 : 아무 효과

a:visited img{text-decoration: none} 
a:active img{text-decoration: none} 

. 그건 그렇고,이 테두리는 크롬에 나타나지 않습니다. 여기

그 이미지에 내 CSS 코드를 간주된다 :

#back_to_photos{ 
float:right; 
position: relative; 
margin-top:-238px; 
margin-right: 40px; 

} 
a:visited {text-decoration: none} 
a:active {text-decoration: none} 

감사합니다!

+0

난 당신이 국경을 사용하지한다고 생각합니다. –

+0

아래 답변 중 하나가 문제를 해결하면 답변을 답변으로 표시하여 포스터에 감사 할 수 있습니다. (예 : @alex 또는 @Bojangles) – JMD

답변

1

This post은 이렇게하는 방법을 설명합니다. 즉 a:visited CSS에 outline: 0;을 넣는 것이 트릭을 수행해야합니다.

text-decoration은 밑줄 및 취소 선과 같은 항목 만 취급합니다. 발생한 문제는 outline으로 클릭/집중 링크를 거쳐 사용자가 가리키고있는 것을 알려줍니다.

개요를 제거하면 키보드로 페이지를 탐색 할 때 사용자가있는 위치가 분명하지 않음에 유의하십시오.

+0

감사합니다. –

0

outline: none을 사용하려고합니다.

외곽선을 숨기면 특히 키보드로 이동하는 사용자에게 유용성 문제가 발생할 수 있습니다.

+0

감사합니다. –

2

아마도 규칙의 순서에 문제가있을 수 있습니다 (이 예문에서는 유일하게 언급 된 스타일이 무엇인지 모름). ! 당신이 시도 할 수있는 것은 중요한 를 사용하여 '강제'하는 것입니다

a {text-decoration: none !important;} 

가 도움이 희망.

a:link, a:link:hover { text-decoration: none } 

가 도움이되기를 바랍니다 :

+0

OP의 문제는 대신'text-decoration'가 아니라'outline'입니다. 내/알렉스의 답변을 더 자세히 보려면 ​​:-) – Bojangles

+0

오, 알겠습니다, 죄송합니다, 일요일 날 용서해주십시오. 그러나 그는 대신 {border : none;}을 시도 할 수 있습니다. – Codebeat

+0

'border : none'은 실제 테두리가 아니기 때문에 작동하지 않습니다. 이것은 outline이기 때문에 실제로 outline : none 속성은 그것을 제거합니다. – Bojangles

2

문제에 대한 솔루션이입니다.

대한 추가 정보는에 : 없음 : 이미지 나 윤곽에 아무도 : squarefree.com/styles