웹페이지 HTML코드 : 스크롤텍스트 제작_HTML/Xhtml_웹페이지 제작

이 섹션에서 저자는 웹 페이지의 텍스트를 스크롤하고 스크롤 속성을 제어할 수 있는 HTML 코드의 특수 태그에 대해 설명합니다.
스크롤 텍스트 만들기
이 장의 선행 연구를 통해 독자들은 다양한 단락 텍스트의 표시 방법을 잘 제어할 수 있었지만 어떻게 설정하더라도 텍스트는 정적입니다. 이 섹션에서 저자는 웹 페이지의 텍스트를 스크롤하고 스크롤 속성을 제어할 수 있는 HTML 코드의 특수 태그에 대해 설명합니다.
4.3.1 텍스트 스크롤 설정
HTML 기술에서 텍스트를 스크롤하는 방법은 이중 태그를 사용하는 것입니다. HTML 코드에서는 범위의 텍스트를 스크롤할 수 있습니다. 기본값은 오른쪽에서 왼쪽으로 순환 스크롤입니다. D:web 디렉터리에 웹 페이지 파일을 만들고 이름을 mar.htm으로 지정한 다음 코드 4.15와 같이 코드를 작성합니다.

코드 4.15 텍스트 스크롤 설정: mar.htm







텍스트 스크롤 예(기본값): 친절하세요



브라우저 주소창에 http://localhost/mar.htm을 입력하면 그림 4.15와 같은 브라우징 효과가 나타납니다.

그림 4.15 텍스트 스크롤의 기본 형식 설정
그림 4.15에서 너비를 설정하지 않은 경우에는 태그가 전용 라인을 차지합니다.
4.3.2 텍스트 스크롤 방향 설정
태그의 방향 속성은 콘텐츠의 스크롤 방향을 설정하는 데 사용됩니다. 속성 값은 왼쪽, 오른쪽, 위, 아래로 각각 왼쪽, 오른쪽, 위, 아래를 나타냅니다. 예를 들어 다음 코드는 다음과 같습니다.
친절하고 친절하세요
친절하고 친절하세요
친절하고 친절하세요
친절하고 친절하세요
4.3.3 텍스트 스크롤 속도 및 형태 설정
텍스트 스크롤을 설정하려면 태그를 사용하세요. 해당 속성은 아래에 설명되어 있습니다.
— 태그의 scrollamount 속성은 콘텐츠 스크롤 속도를 설정하는 데 사용됩니다.
— 태그의 동작 속성은 콘텐츠 스크롤 방법을 설정하는 데 사용됩니다. 기본값은 순환 스크롤입니다. 해당 값이 대체인 경우 콘텐츠가 앞뒤로 스크롤됩니다. 순환 방식. 해당 값이 슬라이드이면 콘텐츠가 한 번 스크롤을 중지하고 반복되지 않습니다. 스크롤 주기 수를 설정하는 루프 속성도 있으며, 기본값은 제한이 없습니다.
— 태그의 scrolldelay 속성은 콘텐츠 스크롤 시간 간격을 설정하는 데 사용됩니다.
— 태그의 bgcolor 속성은 콘텐츠 스크롤 배경색을 설정하는 데 사용됩니다(본문의 배경색 설정과 유사).
— 태그의 너비 속성은 콘텐츠 스크롤 배경의 너비를 설정하는 데 사용됩니다.
— 태그의 높이 속성은 콘텐츠 스크롤 배경 높이를 설정하는 데 사용됩니다.
mar.htm 웹페이지 파일을 수정하고 코드 4.16과 같이 코드를 작성합니다.

코드 4.16 텍스트 스크롤 설정: mar.htm







텍스트 스크롤 예(기본값): 친절하세요
텍스트 스크롤 예시(오른쪽): 친절하세요
텍스트 스크롤 예(아래쪽, 스크롤 모드는 슬라이드, 속도는 10): 친절하고 친절하세요
텍스트 스크롤 예(기본 방향, 스크롤 모드는 교대로, 3회 반복, 속도는 2): 친절하고 친절하세요
텍스트 스크롤 예(위쪽, 배경색은 #CCFF66, 배경 너비와 높이가 설정됨): 친절하세요



브라우저 주소창에 http://localhost/mar.htm을 입력하면 그림 4.16과 같은 브라우징 효과가 나타납니다.

그림 4.16 다양한 형태의 텍스트 스크롤
의 많은 속성을 사용하면 스크롤 텍스트를 만드는 것이 매우 편리해집니다. 다음 JavaScript 학습에서 독자는 태그의 동적 동작에 대해 계속해서 심화 학습하게 됩니다.