html5怎么实现鼠标悬停时显示文本
4个回答
展开全部
CSS3实现鼠标悬停图片并放大显示效果。
文件引用:
.tv_hot {
width: 350px;
}
.avatar {
position: relative;
}
.tv_hot .avatar {
display: block;
height: 220px;
overflow: hidden;
width: 350px;
}
.tv_hot .avatar img {
height: 220px;
}
.avatar:after {
bottom: 0;
content: url("../images/bg_play.png");
left: 5px;
position: absolute;
z-index: 10;
}
.avatar:hover, .zhuti .avatar:hover, .bbsinner .avatar:hover {
box-shadow: 0 0 10px gray;
}
.avatar:hover img, .zhuti .avatar:hover img, .bbsinner .avatar:hover img {
transform: scale(1.3);
transition: all 1s ease 0s;
-webkit-transform: scale(1.3);
-webkit-transform: all 1s ease 0s;
}
文件引用:
.tv_hot {
width: 350px;
}
.avatar {
position: relative;
}
.tv_hot .avatar {
display: block;
height: 220px;
overflow: hidden;
width: 350px;
}
.tv_hot .avatar img {
height: 220px;
}
.avatar:after {
bottom: 0;
content: url("../images/bg_play.png");
left: 5px;
position: absolute;
z-index: 10;
}
.avatar:hover, .zhuti .avatar:hover, .bbsinner .avatar:hover {
box-shadow: 0 0 10px gray;
}
.avatar:hover img, .zhuti .avatar:hover img, .bbsinner .avatar:hover img {
transform: scale(1.3);
transition: all 1s ease 0s;
-webkit-transform: scale(1.3);
-webkit-transform: all 1s ease 0s;
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
这是特效要用js和jq
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
建议你到【千锋】官网查看教程
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询