图片聚焦简介效果
来源:互联网 发布:.cx域名行情 编辑:程序博客网 时间:2024/05/12 18:23
鼠标移上图片时,边框高亮,并浮出半透明简介
<style type="text/css">
width:300px;
display:block;
position:relative;
}
a:hover{
border:2px solid #C03; //边框高亮
}
a span{
position:absolute;
z-index:33;
bottom:2px;
left:2px;
width:300px;
height:40px;
filter:alpha(Opacity=50);-moz-opacity:0.5;opacity: 0.5;
background:#000;
color:#fff;
line-height:40px;
text-align:left;
display:none; // 简介层默认隐藏
}
a:hover span{
display:block; //利用父元素的hover状态来控制自身的显示与隐藏
}
</style>
<body>
<div>
<a href="http://imooc.com">
<img src="1.jpg" />
<span>图片简介</span>
</a>
</div>
</body>
0 0
- 图片聚焦简介效果
- 从AS3制作图片聚焦效果,小议alpha属性
- Jquery聚焦效果
- 引导页 聚焦效果
- Android TV界面聚焦效果---凸显效果
- lytro原始图片重聚焦
- 图像处理之_聚焦效果LogPolar
- 聚焦
- jquery聚焦自动轮播图片
- 图片效果
- 图片效果
- android 图片叠加效果——两种方法的简介与内容
- [转] 效果类型简介
- android 动画效果 简介
- cocos2d-x 2.2.0 图片选中聚焦 ,图片描边 CCClippingNode 实现
- 使用unity Cinemachine做出相机沿固定轨道移动且镜头自动聚焦对象效果
- 层叠图片,图片切换效果
- 显示图片渐隐效果
- MySQL设置连接权限
- 四舍五入函数
- [leetcode 168] Excel Sheet Column Title
- redis 源码学习(复制 Replication)
- MES(制造执行系统)如何进行高速实时数据采集
- 图片聚焦简介效果
- 《设计模式之禅》笔记12 -- 装饰模式
- 学习笔记—java中的内存分配
- 用AFNetworking上传图片
- POJ 3615 Cow Hurdles (Floyd算法)
- LeetCode--Valid Palindrome
- HTML常用标签及其全称
- 造梦师的梦想是什么样的?
- Android Inflate方法