Latest web development tutorials

CSS 링크 (링크)

다른 링크는 다른 스타일을 가질 수있다.

링크 스타일

스타일 링크, 당신은 (예 : 색상, 글꼴, 배경 등) 모든 CSS 속성을 사용할 수 있습니다.

특수 링크가 어떤 상태에 따라 다양한 스타일을 가질 수있다.

네 링크 상태는 다음과 같습니다

  • A : 링크 - 일반, 방문하지 않은 링크
  • A : 방문 - 사용자가 방문한 링크
  • A : 호버 - 링크시기를 사용자 마이스
  • A : 활성 - 링크는 순간을 클릭

예

A : 링크 {색상 : #의 FF0000;} / * 방문하지 않은 링크 * /
A : 방문한 {색상 : # 00FF00;} / * 방문한 링크 * /
A : 가져가 {색상 : #의 FF00FF;} / * 링크 *에 마우스를 이동 /
A : 활성 {색상 : #의 0000FF;} / * 마우스 클릭 * /

»시도

링크 상태 스타일의 숫자로 설정하면, 순서의 몇 가지 규칙이 있습니다 :

  • A : 링크와 : 나중에 방문 호버은 ㄱ을 따라야합니다
  • A : 활성을 따라야합니다 : 뒤에 가져

일반 링크 스타일

링크 색상 변경 위의 예에 따르면,에 어떤 상태를 확인합니다.

의 링크 스타일에 다른 일반적인 방법을 살펴 보자 :

텍스트 장식

텍스트 장식 속성은 주로 링크에 밑줄을 제거하는 데 사용됩니다 :

예

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}

»시도

배경 색상

배경색 속성은 링크의 배경색을 지정

예

a:link {background-color:#B2FF99;}
a:visited {background-color:#FFFF85;}
a:hover {background-color:#FF704D;}
a:active {background-color:#FF704D;}

»시도

예

더 많은 예제

하이퍼 링크의 다른 스타일을 추가
이 예는 하이퍼 링크에 다른 스타일을 추가하는 방법을 보여줍니다.

고급 - 연결 상자 만들기
이 예는 우리가 CSS 속성의 수는 상자로 표시 결합, 더 진보 된 예를 보여줍니다.