[HTML/CSS] 링크(a href)의 밑줄 없애기, 점선, 색깔 바꾸기

CSS a태그 링크 밑줄 없애기, 밑줄 스타일, 색상 변경

1. 링크 밑줄 없애기

<a> 태그는 링크 태그로, 기본적으로 텍스트의 밑줄이 생긴다.

밑줄 제거 방법은 최상위 css 혹은 선택자 클래스의 다음과 같이 설정한다.

a {
  text-decoration-line: none; /* 밑줄제거 */
/*   text-decoration-line: underline; 밑줄 표시 */
/*   text-decoration-line: overline; 윗줄 표시*/
/*   text-decoration-line: line-through; 취소선 표시*/
/*   text-decoration-line: underline line-through overline; */
}

2. 밑줄 색상 변경

a {
  text-decoration-color : red; /* 밑줄 색상 변경 */
}

3. 밑줄 모양 변경

a {
/*   text-decoration-style : solid; */
/*   text-decoration-style : double; */
  text-decoration-style : dotted;
/*   text-decoration-style : dashed; */
/*   text-decoration-style : wavy; */
}