css怎么制作滚动页面 |css tabindex

html,body {
height:100%;
width:100%;
margin:0;
padding:0;
overflow:hidden;
}
p {
font-size:20px;
line-height:30px;
padding:10px;
text-align:justify;
white-space:pre-wrap;
margin:0;
}
.wrapper {
height:100%;
width:100%;
position:relative;
left:0;
top:0;
}
.container {
height:100%;
width:200%;
position:absolute;
left:0;
top:0;
animation:scroll-left 25s linear infinite;
}
.container p {
float:left;
width:50%;
}
@keyframes scroll-left{
0%{left:0;}
100%{left:-100%;}
}

首先，在CSS中设置html和body的高度和宽度为100%，并将margin和padding都设为0。将overflow设为hidden，可以让页面的滚动效果更加流畅。

然后，设置段落的样式，包括字体大小、行高、段落内边距、文本对齐方式和换行方式。

接下来，在包含段落的容器中，设置其高度为100%，然后设置一个相对定位的“.wrapper”类，这样可以让容器相对于其包含块（即“body”元素）进行定位。

接着，在容器内部添加一个绝对定位的“.container”类，将其宽度设为200%，这样可以让页面在水平方向发生滚动。并且，将其定位在左上角（即左边距和上边距都为0）。在“animation”属性中定义滚动效果。

最后，在“container”类中设置段落的样式，使用“float”属性将它们“分割”为左右两部分，让它们适应容器的宽度。

这就是使用CSS创建滚动页面的简单步骤。尝试一下吧，让你的网站更加独特和互动！