움직이는 태그를 통해 스크롤 효과를 완성하는 순수 HTML 코드-HTML 튜토리얼-php.cn

집

웹 프론트엔드

HTML 튜토리얼

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

Y2J

May 23, 2017 am 10:04 AM

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

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

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

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

중요속성:

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

구문: ... 🎜>

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

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

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

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

구문: ...

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

구문: ...

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

구문 : ...

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.