面试官:来实现一个js上下信息循环滚动

 

 

 

<!doctype html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=yes,viewport-fit=cover">
<title>title</title>
<meta name="keywords" content="title" />
<meta name="description" content="title" />
<link href="css/css_zsy.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<style>
.rdwd{
width: 90%;
margin: 0 auto;
margin-top: 1rem;
}
.rdwd_title{
text-align: center;
color: #00c8aa;
font-weight: bold;
font-size: 0.7rem;
}
.rdwd_box{
width: 100%;
height: 10rem;
overflow-y: auto;
margin-top:0.5rem;
}
.rdwd_box::-webkit-scrollbar {
display: none;
}
.rdwd_box01 {
overflow: hidden;
}

.rdwd_box02 {
overflow: hidden;
}
.rdwd_box1
{
margin-top:0.5rem;
}
.rdwd_box2{
margin-top:0.5rem;
}
.rdwd_box3{
margin-top:0.5rem;
}
.rdwd_box1 p:nth-child(1){
color: #fd9c2b;
margin-bottom:0.2rem;
}
.rdwd_box1 p:nth-child(2) {
color: #666666;
text-align: justify;
font-size: 0.55rem;
}
.rdwd_box2 p:nth-child(1) {
color: #fd9c2b;
margin-bottom:0.2rem;
}

.rdwd_box2 p:nth-child(2) {
color: #666666;
text-align: justify;
font-size: 0.55rem;
}
.rdwd_box3 p:nth-child(1) {
color: #fd9c2b;
margin-bottom:0.2rem;
}

.rdwd_box3 p:nth-child(2) {
color: #666666;
text-align: justify;
font-size: 0.55rem;
}

</style>
</head>

<body>
<!-- 热点问答 -->
<div class="rdwd">
<div class="rdwd_title">

 

更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/120055573

posted @ 2022-07-19 17:59  忘川信使  阅读(265)  评论(0编辑  收藏  举报