Leta Learns

a태그 href 링크 밑줄 없애기, 색 변경 본문

HTML & CSS

a태그 href 링크 밑줄 없애기, 색 변경

leta 2021. 7. 23. 17:37

 

특정 부분의 text-decoration 없애기

 

- HTML 인라인 태그 방식

style="text-decoration:none"
<a href="https://www.naver.com/" style="text-decoration:none">Naver</a>

 

 

 

- CSS에서 적용하는 방식

a { text-decoration:none !important }
a:hover { text-decoration:none !important }

hover : 마우스를 대상 위에 올렸을 때. 얹었을 때.

(적용되지 않는 경우 세미콜론 앞에 !important 추가)

 

 

 

 

모든 a 태그의 text-decoration 없애기

 

- CSS

a { text-decoration:none }

 

 

 

 

a 태그 색상 변경

하이퍼링크 속성

  • link : 아직 방문하지 않은 링크의 색상
  • vlink : 방문한 적 있는 링크의 색상
  • alink : 마우스로 클릭할 시 나타나는 링크 색상
  • href : 해당 태그를 클릭할 시 이동시킬 페이지의 주소
  • title : 마우스를 대고 있을 때 나오는 링크의 설명 (팝업창으로 뜨는 간략한 메시지 박스)
  • target : 이동시킬 페이지의 형태 (새 창, 현재 창, 부모 창, 가장 상위 창 etc)

 

- 색 변경 (HTML)

<body link="black" vlink="black" alink="navy">
	<a href="https://www.naver.com/">Naver</a>
</body>

 

 

 

 

 

참고 : https://coding-restaurant.tistory.com/229

https://coding-factory.tistory.com/179

 

 

 

Comments