Dev/HTML, CSS
[css] 링크 밑줄 없애기
bskyvision.com
2021. 3. 13. 10:27
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] 링크 효과 관련 a:link, a:visited, a:hover, a:active 정리
(이 글은 2021-3-15에 마지막으로 수정되었습니다.)