滚动文本,下面的蓝色块沿着蓝线移动。如果我通过相对位置进行操作并将蓝色块设置为顶部 20px,它也会将文本向下移动。
有没有办法我可以纯粹在 CSS 中做到这一点,或者我应该使用上半部分设置为透明 gif 和底部蓝色的背景图像?
到目前为止我尝试过的代码是:
#menu ul {
list-style:none;
margin:0;
padding:10px;
text-align:center;
}
#menu ul li {
display:block;
float:left;
list-style:none;
margin-right: 40px;
font-family: Arial, Helvetica, sans-serif;
color: #FFF;
font-size: 14px;
padding-top: 5px;
padding-bottom: 5px;
height: 39px;
}
#menu ul li a {
display:block;
margin:0px;
padding:0px;
color:#FFF;
text-decoration:none;
font-family: Arial, Helvetica, sans-serif;
margin-right: 5px;
margin-left: 5px;
padding-left: 10px;
padding-right: 10px;
}
#menu ul li a:hover {
color:#fff;
margin-bottom:5px;
padding-bottom:5px;
}
#menu ul li a.active,
#menu ul li a.active:hover {
color:#fff;
background-color: #0488C5;
font-weight:bold;
}
我还在学习,请原谅任何错误!