以下是一个简单的HTML跑马灯代码，可以实现图片和文字的移动效果：
<!DOCTYPE html>
<html>
<head>
<style>
.marquee {
width: 100%;
overflow: hidden;
white-space: nowrap;
}
.marquee img,
.marquee span {
display: inline-block;
padding-right: 50px; /* 调整图片或文字之间的间距 */
vertical-align: top;
animation: marquee 10s linear infinite;
}
@keyframes marquee {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}
</style>
</head>
<body>
<div class="marquee">
<img src="image1.jpg" alt="Image 1">
<img src="image2.jpg" alt="Image 2">
<span>Text 1</span>
<span>Text 2</span>
</div>
</body>
</html>
你可以将上述代码保存为一个HTML文件，并将image1.jpg、image2.jpg和Text 1、Text 2替换为你自己的图片和文字。此代码将创建一个水平滚动的跑马灯，图片和文字将从右侧滚动到左侧，然后重新开始。你还可以通过调整padding-right的值来调整图片或文字之间的间距。
