Div与覆盖和按钮
Div with overlay and button
我需要在
上添加0.5的不透明度<div class="panel panel-default">
</div>
div有CSS
.panel.panel-default {
border-top-color: #F5F5F5;
border-top-width: 1px;
}
.panel {
float: left;
width: 100%;
border: 0px;
border-top: 2px solid #E5E5E5;
margin-bottom: 20px;
position: relative;
-moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
}
.panel-default {
border-color: #ddd;
}
.panel {
margin-bottom: 20px;
background-color: #fff;
border: 1px solid transparent;
/* border-radius: 4px; */
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
box-shadow: 0 1px 1px rgba(0,0,0,.05);
}
html * {
outline: none !important;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
user agent stylesheetdiv {
display: block;
}
现在我想让这个div的不透明度高于0.5,在这个不透明div的中心我在垂直和水平方向输入4个按钮
所以我要在不透明度中插入一个新的div然后为4个按钮添加另一个div,
<div class="panel panel-default">
<div style="overlay"><div style="bottons">1</div><div style="bottons">2</div><div style="bottons">3</div><div style="bottons">4</div></div>
</div>
http://jsfiddle.net/qu62mvkk/10/http://jsfiddle.net/qu62mvkk/13/不要使用不透明度,因为所有子元素都会继承它,使用背景色RGBA代替。如:
background: rgba (255255255, 0.5),
这将只使你选择的div具有不透明度。
相关文章:
- 如何在视频标签中添加按钮覆盖
- 如何使用PHP、提交和单选按钮复制/重命名/覆盖图像
- 将事件处理程序放在HTML按钮上,而不覆盖其默认功能
- 单击Fancy Box覆盖按钮调用Ajax时,Ajax未按预期工作
- 在覆盖和关闭按钮或链接中为img添加边框
- 触摸设备中的视频JS播放器覆盖按钮
- 动态覆盖jqueryUI对话框按钮(保存,取消等到用户选择)文本
- 代码镜像 - 覆盖主页/结束按钮以正常工作
- Ext.window 在父类中窗口的关闭按钮上覆盖子类中的销毁
- mmenu:覆盖点击按钮的背景色
- Javascript 后退按钮事件侦听器覆盖 android 设备后退按钮
- 覆盖 Salesforce 页面中的标准按钮
- 通过单击按钮覆盖 z 索引
- 如何使用 JavaScript 在单击按钮时覆盖动态创建的表的行值
- 如何使用jQuery覆盖来获得弹出窗口的单选按钮
- 预览按钮覆盖表单中的提交按钮行为
- JQuery移动多行按钮覆盖问题
- HTML输入框只读--javascript按钮覆盖文本
- 覆盖按钮覆盖所有图像
- 在悬停时用两个按钮覆盖表格单元格