방법: FrontPage 2003에서 스타일 시트를 사용 하 여 사용자 지정 하이퍼링크 만들기

이 문서의 Microsoft FrontPage 2002 버전을 참조 하십시오.
287706 .

요약

Microsoft Office FrontPage 2003에서 계단식 스타일 시트 (CSS)를 사용 하 여 사용자 지정 하이퍼링크를 만드는 방법을 설명 합니다. 계단식 스타일 시트 기능을 사용 하 여 사용자 지정 하이퍼링크를 만드는 방법을 보여 주는 예제가 포함 되어 있습니다.

참고: 이 문서에서는 계단식 스타일 시트 기능 모든 웹 브라우저에서 지원 되지 않을 수 있습니다. 자세한 내용은 FrontPage 도움말을 참조 하십시오. 이렇게 하려면에서 Microsoft FrontPage 도움말 을 클릭 하면
도움말 메뉴에서 계단식 스타일 시트 호환성 검색 창에 입력 하 고 enter 키를 눌러 반환 되는 항목을 보십시오.

맨 위로

스타일 시트를 사용 하 여 사용자 지정 하이퍼링크 만들기

다음 예제에서는 계단식 스타일 시트 기능을 사용 하 여 사용자 지정 하이퍼링크를 만드는 방법을 보여 줍니다.

Microsoft는 모든 보증, 그림에 대 한 묵시적인 보증. 이 포함 되지만 상품성 또는 특정 목적에의 적합성의 묵시적된 보증에 국한 되지는 않습니다. 이 문서는 작성 하 고 프로시저를 디버깅할 데 사용 되는 도구 및 여기서 설명 하는 프로그래밍 언어에 익숙한 가정 합니다. Microsoft 지원 엔지니어는 특정 프로시저의 기능을 설명할 수 있지만 추가 기능을 제공 하거나 특정 요구 사항에 맞도록 프로시저를 구성 하는 이러한 예제를 수정 하지 않습니다. 오류 메시지가 참고 수도 있습니다 또는이 문서에서 직접 예제를 복사 하 고 FrontPage에 붙여 넣을 경우는 페이지가 제대로 표시 되지 않을 수 있습니다. 꺾쇠 괄호 (< 및 >)가 HTML 코드로 나타날 수 있습니다. 이 문제를 해결 하려면 먼저 메모장의 빈 문서에 코드 예제를 붙여 및 다음 메모장의 문서에서에서 FrontPage의 페이지로 복사 합니다.

맨 위로

예제 1: 밑줄만 다른 색으로 표시 되는 위치는 하이퍼링크 만들기

문서의 텍스트와 동일한 색으로 있는 하이퍼링크의 텍스트 서식을 설정 하는이 예제입니다. 하이퍼링크의 밑줄만 다른 색으로 표시 됩니다. 사용자 지정 하이퍼링크를 만들려면 다음과이 같이 하십시오.
  1. FrontPage를 시작 하 고 비어 있는 새 페이지를 만듭니다.
  2. 보기 메뉴를 클릭합니다
    페이지, 다음 페이지의 맨 아래에 클릭 하 고
    코드입니다.
  3. 에 다음 코드를 삽입 하면
    < 헤드 >< / 헤드 > 페이지의 영역:
    <style>body      { color: black; background-color: white; font-family: arial }
    a { color: black; text-decoration: none; border-bottom-style: solid; border-bottom-width: 1px }
    a:link { border-bottom-color: blue }
    a:visited { border-bottom-color: purple }
    a:hover { border-bottom-color: green }
    a:active { border-bottom-color: red }
    </style>

  4. 에 다음 코드를 삽입 하면
    < 본문 >< / 바디 > 페이지의 영역:
    <p>Please see <a href="http://www.microsoft.com">http://www.microsoft.com</a> for more.</p><p>Please see <a href="http://www.msn.com">http://www.msn.com</a> for more.</p>

  5. 파일 메뉴에서 클릭
    저장합니다.
  6. 다른 이름으로 저장 대화 상자에서 파일 저장, 파일 이름 상자에 Example1을 입력 한 다음을 저장할 위치를 지정 합니다.
    저장합니다.
  7. 파일 메뉴에서 브라우저에서 미리 보기선택 하 고 페이지를 미리 보는 데 사용할 웹 브라우저를 클릭 합니다.
맨 위로

예제 2: 호버 단추를 사용 하는 하이퍼링크 만들기

이 예제에서는 단색 배경의 호버 스타일 단추를 사용 하는 하이퍼링크를 만듭니다. 사용자 지정 하이퍼링크를 만들려면 다음과이 같이 하십시오.
  1. FrontPage를 시작 하 고 비어 있는 새 페이지를 만듭니다.
  2. 보기 메뉴를 클릭합니다
    페이지, 다음 페이지의 맨 아래에 클릭 하 고
    코드입니다.
  3. 에 다음 코드를 삽입 하면
    < 헤드 >< / 헤드 > 페이지의 영역:
    <style>body      { color: black; background-color: white; font-family: arial }
    a { text-decoration: none; padding: 3px }
    a:link { color: white; background-color: blue }
    a:visited { color: white; background-color: purple }
    a:hover { color: white; background-color: green }
    a:active { color: white; background-color: red }
    </style>

  4. 에 다음 코드를 삽입 하면
    < 본문 >< / 바디 > 페이지의 영역:
    <p>Please see <a href="http://www.microsoft.com">http://www.microsoft.com</a> for more.</p><p>Please see <a href="http://www.msn.com">http://www.msn.com</a> for more.</p>

  5. 파일 메뉴에서 클릭
    저장합니다.
  6. 다른 이름으로 저장 대화 상자에서 파일 저장, 파일 이름 상자에 Example2를 입력 한 다음을 저장할 위치를 지정 합니다.
    저장합니다.
  7. 파일 메뉴에서 브라우저에서 미리 보기선택 하 고 페이지를 미리 보는 데 사용할 웹 브라우저를 클릭 합니다.
맨 위로

예제 3: 윤곽선 단추를 사용 하는 하이퍼링크 만들기

이 예제에서는 윤곽선이 있는 호버 스타일 단추를 사용 하는 하이퍼링크를 만듭니다. 색이 칠해진된 상자 개요 효과 만드는 하이퍼링크 텍스트 주위에 나타납니다. 사용자 지정 하이퍼링크를 만들려면 다음과이 같이 하십시오.
  1. FrontPage를 시작 하 고 비어 있는 새 페이지를 만듭니다.
  2. 보기 메뉴를 클릭합니다
    페이지, 다음 페이지의 맨 아래에 클릭 하 고
    코드입니다.
  3. 에 다음 코드를 삽입 하면
    < 헤드 >< / 헤드 > 페이지의 영역:
    <style>body      { color: black; background-color: white; font-family: arial }
    a { color: black; text-decoration: none; border-style: solid; border-width: 2px; padding: 2px }
    a:link { border-color: blue }
    a:visited { border-color: purple }
    a:hover { border-color: green }
    a:active { border-color: red }
    </style>

  4. 에 다음 코드를 삽입 하면
    < 본문 >< / 바디 > 페이지의 영역:
    <p>Please see <a href="http://www.microsoft.com">http://www.microsoft.com</a> for more.</p><p>Please see <a href="http://www.msn.com">http://www.msn.com</a> for more.</p>

  5. 파일 메뉴에서 클릭
    저장합니다.
  6. 다른 이름으로 저장 대화 상자에서 파일을 저장, 파일 이름 상자에 Example3을 입력 한 다음을 저장할 위치를 지정 합니다.
    저장합니다.
  7. 파일 메뉴에서 브라우저에서 미리 보기선택 하 고 페이지를 미리 보는 데 사용할 웹 브라우저를 클릭 합니다.
맨 위로

예제 4: 다른 텍스트 서식을 사용 하는 하이퍼링크 만들기

이 예제에서는 하이퍼링크가 밑줄이 없는, 기울임꼴, 소문자 텍스트를 사용 하 여 서식을 지정 합니다. 하이퍼링크 위로 포인터를 이동 하면 하이퍼링크의 텍스트가 대문자로 변환 됩니다. 사용자 지정 하이퍼링크를 만들려면 다음과이 같이 하십시오.
  1. FrontPage를 시작 하 고 비어 있는 새 페이지를 만듭니다.
  2. 보기 메뉴를 클릭합니다
    페이지, 다음 페이지의 맨 아래에 클릭 하 고
    코드입니다.
  3. 에 다음 코드를 삽입 하면
    < 헤드 >< / 헤드 > 페이지의 영역:
    <style>body      { color: black; background-color: white; font-family: arial }
    a { text-decoration: none; font-style: italic; text-transform: lowercase }
    a:link { color: blue; font-weight: bold }
    a:visited { color: purple }
    a:hover { color: green; text-transform: uppercase }
    a:active { color: red }
    </style>

  4. 에 다음 코드를 삽입 하면
    < 본문 >< / 바디 > 페이지의 영역:
    <p>Please see <a href="http://www.microsoft.com">http://WWW.microsoft.COM</a> for more.</p><p>Please see <a href="http://www.msn.com">http://WWW.msn.COM</a> for more.</p>

  5. 파일 메뉴에서 클릭
    저장합니다.
  6. 다른 이름으로 저장 대화 상자에서 파일을 저장, 파일 이름 상자에 Example4를 입력 한 다음을 저장할 위치를 지정 합니다.
    저장합니다.
  7. 파일 메뉴에서 브라우저에서 미리 보기선택 하 고 페이지를 미리 보는 데 사용할 웹 브라우저를 클릭 합니다.
맨 위로

참조

FrontPage 2003에서 스타일 시트에 대 한 자세한 내용은 FrontPage 도움말을 참조 하십시오. 이렇게 하려면 도움말 메뉴에서 Microsoft Office FrontPage 도움말을 클릭 합니다. 안에
검색 상자는 스타일 시트입력 하 고 enter 키를 눌러 반환 되는 항목을 참조.

맨 위로

참조

자세한 내용은 Microsoft 기술 자료의 다음 문서를 참조 하는 다음 문서 번호를 클릭 합니다.
196488 Fs000: 계단식 스타일 시트 무엇입니까?

205996 방법: FrontPage 2000에서 스타일 시트 만들기

240972 방법: FrontPage 2000에서 하이퍼링크에서 밑줄을 제거 합니다.

222949 FP2000: DHTML 및 CSS를 사용 하 여 폼 단추의 호버 효과 만들기

속성

문서 ID: 825450 - 마지막 검토: 2017. 2. 7. - 수정: 2

피드백