老师为什么filter:alpha(opacity=20)无法使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>轮播图</title> <link rel="stylesheet" type="text/css" href="CSS/lunbotu.css"> <script type="text/javascript" src="JS/lunbotu.JS"></script> </head> <body> <div class="main"> <!--图片轮播--> <div class="banner"> <a href=""> <div class="banner-slide slide1 slide-active"> </div> </a> <a href=""> <div class="banner-slide slide2"> </div> </a> <a href=""> <div class="banner-slide slide3"> </div> </a> </div> <!--上一张 下一张--> <a href="javascript:void(0)" class="button prev"></a> <a href="javascript:void(0)" class="button next"></a> </div> </body> </html>
*{
margin: 0;
padding: 0;
}
ul{
list-style: none;
}
body{
font-family:"微软雅黑";
color: #14191e;
}
.main{
width: 1200px;
height: 460px;
margin: 30px auto;
overflow: hidden;
position: relative;
}
.banner{
width: 1200px;
height: 460px;
overflow: hidden;
position:relative;
}
.banner-slide{
width: 1200px;
height: 460px;
background-repeat:no-repeat;
position: absolute;
display: none;
}
.slide-active{
display: block;
}
.slide1{
background-image:url("../img/bg1.jpg");
}
.slide2{
background-image:url("../img/bg2.jpg");
}
.slide3{
background-image:url("../img/bg3.jpg");
}
.button{
position: absolute;
width: 40px;
height: 80px;
left: 244px;
top: 50%;
margin-top: -40px;
background:url(../img/arrow.png) no-repeat center center;
}
.button:hover{
background-color:#333;
opacity: 0.2;
filter:alpha(opacity=20);/*透明度的修改*/
}
.prev{
transform:rotate(180deg);/*控制旋转角度*/
}
.next{
left:auto;
right: 0px;
}
正在回答 回答被采纳积分+1
- 参与学习 人
- 提交作业 676 份
- 解答问题 9666 个
本阶段将从前端网页搭建入手,到Java Web基础,前后端结合助你完成Java Web小白的蜕变!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星