집 > 기사 > 웹 프론트엔드 > 움직이는 태그를 통해 스크롤 효과를 완성하는 순수 HTML 코드

움직이는 태그를 통해 스크롤 효과를 완성하는 순수 HTML 코드

Y2J원래의: 2017-05-23 10:04:582603검색

이 글에서는 HTML 태그의 사용 방법을 소개합니다. ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b는 js 제어 없이도 다양한 스크롤 효과를 얻을 수 있으며 관심 있는 친구는 꼭 읽어보세요.

페이지의 자동 스크롤 효과는 자바스크립트로 구현할 수 있지만 오늘 우연히 js 제어 없이 다양한 스크롤 효과를 구현할 수 있는 html 태그인 ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b를 발견했습니다.

marquee 태그를 사용하면 텍스트뿐만 아니라 그림, 테이블 등도 이동할 수 있습니다.

구문: ed126914ed1419bab26abf7cf307b7b9 ..7204e33a7a23f6efcc788532e245c31b 설명: 마커 사이에 스크롤할 내용을 추가합니다.

중요속성:

1. 스크롤 방향방향(4개 포함) 값: 위쪽, 아래쪽, 왼쪽 및 오른쪽)

구문: 5589875a91bee676d2c0d9c4577d4653...7204e33a7a23f6efcc788532e245c31b 🎜>

2. 스크롤 동작(스크롤:

루프 스크롤, 기본 효과; 슬라이드: 한 번만 스크롤한 후 중지; 대체: 앞뒤로 번갈아 스크롤)

구문: < ;marqueebehavior="Scrolling mode">...7204e33a7a23f6efcc788532e245c31b

3. 스크롤 속도 스크롤 양(스크롤 속도는 스크롤할 때마다 이동하는 길이를 픽셀 단위로 설정하는 것입니다)

구문: 803bf89a41c47553be5b45800afa3e65...7204e33a7a23f6efcc788532e245c31b

4. 스크롤 지연 scrolldelay(스크롤 간격을 밀리초 단위로 설정)

구문: 153370dc92c437739cac39176d0aa63b...7204e33a7a23f6efcc788532e245c31b

5. 스크롤 루프 루프(기본값은 -1, 스크롤이 계속 루프됩니다)

구문 : 69457943bcb520c612032510d36031b7...7204e33a7a23f6efcc788532e245c31b

6. 스크롤 범위

너비, 높이

7. 배경색 스크롤 bgcolor

8. 공백 hspace, vspace

JavaScript 코드클립보드에 콘텐츠 복사

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
<html xmlns="http://www.w3.org/1999/xhtml">   
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
<title>无标题文档</title>   
</head>   
<body>   
<p>   
<marquee direction="up" behavior="scroll" scrollamount="1" scrolldelay="0" loop="-1" width="1000" height="50" bgcolor="#0099FF" hspace="10" vspace="10">   
指整个Marquee对齐方式; (2)behavior:设置滚动的方式: scroll:表示由一端滚动到另一端,会重复,缺陷是不能无缝滚动。 slide:表示由一段滚动到另一端,不会重复...   
</marquee>   
</p>   
</body>   
</html>

【관련 추천사항】

HTML 무료 동영상 튜토리얼

HTML로 개인 이력서 작성 코드 예시

새 요소를 만드는 세 가지 방법 공유

HTML의 메타 태그 세부 예

5. 통합 공유 HTML 지식 포인트

위 내용은 움직이는 태그를 통해 스크롤 효과를 완성하는 순수 HTML 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명：

이전 기사：HTML로 개인 이력서를 작성하기 위한 코드 예제다음 기사：HTML로 개인 이력서를 작성하기 위한 코드 예제