기본 HTML / CSS 링크 색상은 무엇입니까?


161

와 같은 코드 표현이 필요합니다 #FFFFFF.


4
어떤 브라우저에서? (정의 된 "표준"은 없습니다.)
John Parker

6
질문은 실제 브라우저 실습과 권장 사항 모두와 관련된 것으로 해석 될 수 있습니다. 특히 HTML5가 색상을 표준화하려고하는데 ( "예상 렌더링"으로), 질문은 주제에 관한 것이며 다시 열어야합니다. 대부분의 투표에 대한 답변은 현재 관행 및 HTML5 CR과 일치 하지 않습니다 .
Jukka K. Korpela 2016 년

1
@ Juka K. Korpela- "가장 많은 표를 얻은 답변"은 움직이는 목표입니다. 의도는 좋았지 만 구체적인 답변을 참조하십시오.
Nicolas

답변:


205

HTML5에서 하이퍼 링크의 전경색은 무엇보다도 기본 렌더링 동작에 대한 지침 형식의 표준화를 위해 추적되고 있습니다 . 특히, 컨텐츠 컨텐츠 섹션에서 가져 오거나 방문하지 않은 하이퍼 링크에 권장되는 기본 색상은 다음과 같습니다.

:link { color: #0000EE; }
:visited { color: #551A8B; }

:link:active, :visited:active그러나 활성 하이퍼 링크 ( )에 권장되는 기본값은 없습니다 .

이러한 기본 색상을 사용하고 합리적 으로 작동 것으로 예상 할 수 있습니다. 그러나 브라우저는이 가이드 라인 을 따를 필요 가 없기 때문에 이러한 가이드 라인 중 일부 또는 전부를 무시해도 됩니다. 그러나 여러 브라우저에서 일관된 사용자 환경 (이 문맥에서 "예상"이 정의되는 방식)에 대해 권장 되므로 이러한 색상이 대부분의 브라우저의 기본값과 일치 할 가능성이 있습니다. 최악의 경우, 여전히 실제 값의 합리적인 근사치 로 사용됩니다.

특히 최신 버전의 Firefox 및 Chrome에서 기본 미 방문 및 방문 링크 색상은 위의 지침과 일치하지만 최신 버전의 IE에서는 다른 값을보고합니다. 미 방문 링크는 rgb(0, 102, 204), 또는 #0066CC이고 방문한 링크는 rgb(128, 0, 128), 또는 #800080입니다. 이전 버전의 Firefox (및 Safari / Chrome)도 기본값이 다릅니다. 그러나 이전 버전입니다. 내가 알고있는 주요 이상 점은 IE입니다. Project Spartan에서 변경 될지 여부에 대해서는 아직 알려진 바가 없습니다. 현재는 최신 버전의 IE와 동일한 값을 반영합니다.

HTML5에서 제안하지 않고 모든 브라우저에서 사용 하는 표준화 된 색 구성표를 찾고 있다면 하나도 없습니다. 순수한 CSS를 사용하여 특정 요소의 특정 속성에 대한 브라우저의 기본값으로 되 돌리는 방법도 없습니다. HTML5에서 제안한 색상을 사용하거나 고유 한 색상 구성표를 고안하여 대신 사용해야합니다. 이러한 옵션 중 하나는 브라우저에 관계없이 브라우저의 기본값보다 우선합니다.

의심스러운 경우, about:blank오늘 적용 할 수있는 기본 색상을 알아 내기 위해 앞에서 설명한 기술을 항상 사용할 수 있습니다. 예를 들어,이를 사용하여 모든 브라우저에서 활성 링크 색상을 스니핑 할 수 있습니다. Firefox 최신 버전 (이 업데이트 현재 29) rgb(238, 0, 0)에서는 또는 #EE0000입니다.


고맙지 만 모질라, 사파리, 즉 크롬에 대한 평균 코드가 있습니까? 기본 "파란색"뿐만 아니라? 기본 스타일을 적용하려면 모든 링크 스타일 (방문, 호버링)이 필요합니다.
Bill

91
  • 표준 링크-# 0000FF // 파랑
  • 방문한 링크-# 800080 // 보라색
  • 활성 링크-# FF0000 // 빨간색

그것은 표준 이었지만 지금은 브라우저마다 크게 다릅니다. (닐슨이 포기한 이후)


13
왜 66 명이이 답변에 대한 답을 얻었는지 잘 모르겠습니다. 이 답변이 소스를 제공하지 않는 표준에서 나온 값이더라도이 답변이 암시하는 바와 같이 그 표준은 오랫동안 사용되지 않았으며 새 코드에서 사용하는 것은 의미가 없습니다.
BoltClock

@ stom : 그것은 별도의 대답이어야하는 것처럼 보입니다. 소스 링크가 되려고하더라도 여기에 세 값 중 어느 것도 나타나지 않기 때문에 유효한 소스가 아닙니다.
BoltClock

16

사용자가 기본 설정을 변경하지 않았다고 가정하면 Gecko의 기본 색상은 다음과 같습니다.

  • 표준 링크 : #0000EE(파란색)
  • 방문한 링크 : #551A8B(보라색)
  • 활성 링크 : #EE0000(빨간색)

출처

Gecko는 사용자 색상의 이름도 제공합니다. 그들이 있습니다 -moz-hyperlinktext -moz-visitedhyperlinktext그리고 -moz-activehyperlinktext그들은 또한 제공 -moz-nativehyperlinktext시스템 링크 색상이다.


4

공식 기본 HTML 스타일 시트 에 따르면 정의 된 기본 링크 색상이 없습니다. 그러나 적절한 그래픽 편집기에서 스크린 샷을 찍고 피펫 도구를 사용하거나 브라우저의 개발자 도구를 사용하여 브라우저에서 사용하는 기본 설정을 찾을 수 있습니다 ( a요소 선택 , 찾기 computed values>color).


3

Chrome의 색상에 익숙하므로 링크 용 Chrome의 파란색은 #007bff


1

방문하는 웹 사이트에 따라 다르며 웹 사이트의 덮어 쓰기가없는 브라우저에 있습니다. 이에 대한 표준은 없습니다.


1

나에게 Chrome (2018 년 6 월 업데이트)에서 방문하지 않은 링크의 색상은 # 2779F6입니다. 스크린 샷을 찍고 스크린 샷을 색상 코드로 변환하는 html-color-codes.info와 같은 웹 사이트를 방문하면 항상 확대하여 볼 수 있습니다.


0

무언가에 대한 브라우저의 기본 스타일을 얻는 가장 좋은 방법은 처음부터 요소의 스타일을 지정하지 않는 것입니다.


3
문제는 때때로 스타일이 라이브러리에서 나온다는 것입니다. 방금 jQuery UI의 기본 스타일 시트에가 포함 .ui-widget-content a { color: black; }되어 탭의 모든 링크가 정상적인 색상을 잃는 것으로 나타났습니다 . 이를 무시하고 브라우저의 기본 색상 (또는 사용자의 개인 스타일 시트)을 얻으려면 대신 특정 색상을 하드 코딩해야합니다.
Barmar

2
RGB 값을 알고 싶을 때 또 다른 순간은 링크의 색상과 일치하는 그래픽을 포함하려는 경우입니다.
marcelnijman

0

CSS currentColor에서 링크 내부 의 색상 문자열을 사용하여 테두리를 기본 링크 색상과 동일한 색상으로 만들 수 있습니다.

.example {
    border: 1px solid currentColor;
}

0

다음과 같은 기본 HTML 색상 코드 :

Red      #FF0000  rgb(255, 0, 0)
Maroon   #800000  rgb(128, 0, 0)
Yellow   #FFFF00  rgb(255, 255, 0)
Olive    #808000  rgb(128, 128, 0)
Blue     #0000FF  rgb(0, 0, 255)
Navy     #000080  rgb(0, 0, 128)
Fuchsia  #FF00FF  rgb(255, 0, 255)
Purple   #800080  rgb(128, 0, 128)
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.