嗖一下,答案就来了!

导航:Qui-Note/marquee标签实现左右/上下滚动

marquee标签实现左右/上下滚动

<style type="text/css">
			.left {overflow: hidden;white-space:nowrap;}.left p{display: contents;float: left;}
		</style>
		<marquee class="left" width="200" height="40" behavior="alternate" direction="left" style="border: 1px solid #ddd;">
			<p>前端知识体系</p>
			<p>Web前端开发大系概览</p>
			<p>Web前端开发大系概览-中文版</p>
			<p>Web Front-end Stack v2.2</p>
		</marquee>
		<marquee class="up" width="200" height="40" direction="up" style="border: 1px solid #ddd;">
			<p>前端知识体系</p>
			<p>Web前端开发大系概览</p>
			<p>Web前端开发大系概览-中文版</p>
			<p>Web Front-end Stack v2.2</p>
		</marquee>

效果展示:

前端知识体系

Web前端开发大系概览

Web前端开发大系概览-中文版

Web Front-end Stack v2.2

前端知识体系

Web前端开发大系概览

Web前端开发大系概览-中文版

Web Front-end Stack v2.2