root@bskyvision: ~#
방명록
태그
RSS

<닫기>

3,561,886/3,854/1,390

프로필사진
수많은 소음 속에서 신호를 찾아가는 bskyvision입니다.


<닫기>

  • 꼬장이이(가) 07.25에 작성한 댓글: test.

<닫기>

2021-03-13 10:27:26

a 태그를 이용해서 링크를 달면 기본적으로 밑줄이 쳐집니다. 

 

 

그런데 만약 밑줄이 없는 링크를 보여주고 싶다면 어떻게 해야할까요? 

 

이때는 a 요소의 CSS에서 text-decoration 속성의 값을 none으로 해주면 됩니다. 

 

a {
    text-decoration: none;
}

 

그러면 링크에 밑줄이 쳐지지 않습니다. 어렵지 않죠? ㅎㅎ 

 

 

위 예제의 전체 코드는 다음과 같습니다. 

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
 
    <style>
        a {
            text-decoration: none;
        }
    </style>
 
</head>
<body>
    <a href="https://bskyvision.com">bskyvision</a>
 
</body>
</html>
cs

 

관련 글

[css] 밑줄 여유있게 치기  

[css] 링크 효과 관련 a:link, a:visited, a:hover, a:active 정리  

 

 

(이 글은 2021-3-15에 마지막으로 수정되었습니다.)

  1. 꼬장스카이비전이(가) 2021.03.15 10:19에 작성한 댓글:
    예시도 하나 둬줘   주소   수정/삭제   답글
  2. #Kokoro이(가) 2021.03.16 04:32 신고에 작성한 댓글:
    제가 자주 까먹는 부분이죠 알고는 있는데 묘하게
    사용하려고 하면 기억이 나질 않아요
      주소   수정/삭제   답글
이름
비밀번호
홈페이지
비밀여부