HTML 링크 - 다양한 색상
HTML 링크는 방문한 적이 있는지, 방문하지 않았는지 또는 활성 상태인지에 따라 다른 색상으로 표시됩니다.
HTML 링크 색상
기본적으로 링크는 다음과 같이 표시됩니다(모든 브라우저에서).
- 방문하지 않은 링크는 밑줄과 파란색
- 방문한 링크는 밑줄과 보라색
- 활성 링크는 밑줄과 빨간색으로 표시됩니다.
CSS를 사용하여 링크 상태 색상을 변경할 수 있습니다.
예시
여기에서 방문하지 않은 링크는 밑줄이 없는 녹색으로 표시됩니다. 방문한 링크는 밑줄이 없는 분홍색으로 표시됩니다. 활성 링크는 노란색으로 밑줄이 그어집니다. 또한 링크 위로 마우스를 가져가면(a:hover) 빨간색으로 밑줄이 그어집니다.
<style>
a:link {
color: green;
background-color: transparent;
text-decoration: none;
}
a:visited {
color: pink;
background-color: transparent;
text-decoration: none;
}
a:hover {
color: red;
background-color: transparent;
text-decoration: underline;
}
a:active {
color: yellow;
background-color: transparent;
text-decoration: underline;
}
</style>
링크 버튼
링크는 CSS를 사용하여 버튼으로 스타일을 지정할 수도 있습니다.
이것은 링크입니다예시
<style>
a:link, a:visited {
background-color: #f44336;
color: white;
padding: 15px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a:hover, a:active {
background-color: red;
}
</style>
CSS에 대해 자세히 알아보려면 CSS 자습서 로 이동하십시오 .
HTML 링크 태그
| Tag | Description |
|---|---|
| <a> | Defines a hyperlink |
사용 가능한 모든 HTML 태그의 전체 목록을 보려면 HTML 태그 참조 를 방문하십시오 .