HTML A tag: 링크 테두리 점선 없애기 : onfocus='this.blur()'
사용법과 팁: 구글블로그, 텀블러, 크롬, 파이어폭스, 애드센스, HTML...
<A>태그로 링크가 걸려 있는 글자나 그림(이미지)을 클릭하면, 왼쪽의 앞쪽 그림과 같이, 주위에 링크영역을 표시하는 테두리 점선이 나타난다.
왼쪽 위에 있는 파랑색 트위터 그림은 테두리 점선을 없애는 속성을 주지 않았을 때의 모습이고, 오른쪽의 트위터 그림은 테두리 점선을 없애는 속성을 준 뒤에 클릭한 모습이다.
테두리 점선이 표시되지 않는 것이 깔끔한 장점도 있지만, 글 제목 등과 같이 글자로 된 경우, 여러줄에 하나의 링크가 걸려 있을 때는 테두리 점선이 표시 되는 것이 더 편리할 때가 있다.
[링크 영역 테두리 점선 없애기]
아래는 글자에 링크를 걸었을 때의 예이다.
[태그 모양]
[적용한 모양새: 클릭을 해 보세요]
>> HTML 태그 사용법 목록: DIV P SPAN IMG A HR FONT BR ...
<A>태그로 링크가 걸려 있는 글자나 그림(이미지)을 클릭하면, 왼쪽의 앞쪽 그림과 같이, 주위에 링크영역을 표시하는 테두리 점선이 나타난다.
왼쪽 위에 있는 파랑색 트위터 그림은 테두리 점선을 없애는 속성을 주지 않았을 때의 모습이고, 오른쪽의 트위터 그림은 테두리 점선을 없애는 속성을 준 뒤에 클릭한 모습이다.
테두리 점선이 표시되지 않는 것이 깔끔한 장점도 있지만, 글 제목 등과 같이 글자로 된 경우, 여러줄에 하나의 링크가 걸려 있을 때는 테두리 점선이 표시 되는 것이 더 편리할 때가 있다.
[링크 영역 테두리 점선 없애기]
<a href="링크의 목적지 주소(URL)" onfocus='this.blur()'>
<img src="이미지(그림) 주소(URL)" />
</a>
<img src="이미지(그림) 주소(URL)" />
</a>
아래는 글자에 링크를 걸었을 때의 예이다.
[태그 모양]
<a href="링크 주소" >이 곳에는 속성을 주지 않았습니다</a>
<a href="링크 주소" onfocus='this.blur()'>이 곳에는 속성을 주었습니다</a>
<a href="링크 주소" onfocus='this.blur()'>이 곳에는 속성을 주었습니다</a>
[적용한 모양새: 클릭을 해 보세요]
>> HTML 태그 사용법 목록: DIV P SPAN IMG A HR FONT BR ...