Question

我有这个css代码：

#ticket {
        background:rgba(139,137,137,0.7);
    }

我的表单的ID为ticket

这是在表单上显示背景但是文本输入，文本区域和选择输入并显示背景的“顶部”

如何在所有元素之上显示背景？

Answer 1

试试这个

    #ticket{
    display: block;
    width: 200px;
    height: 100px;
    background: green;  
    position: relative;
}

#ticket:before {
    position: absolute;
    display: block;
    background:rgba(139,137,137,0.7);
    content: "";
    top:0;
    left:0;
    right: 0;
    bottom: 0;
    z-index:9999;
 }

<强> DEMO HERE

Answer 2

如果我理解正确，您希望将输入元素放在表单上，并且仍然能够看到表单的背景颜色吗？

#ticket input,
#ticket textarea,
#ticket select {
    background:transparent;
}

这将使元素的背景透明，以便您可以看到表格＆＃39;背景

＆＃13;

#ticket {
  background: rgba(139, 137, 137, 0.7);
}
#ticket input,
#ticket textarea,
#ticket select {
  background: transparent;
}

＆＃13;

<form id="ticket">
  <input>
  <textarea col="10" row="10"></textarea>
  <select>
    <option>Gender</option>
    <option>Male</option>
    <option>Female</option>
  </select>
</form>

＆＃13;

html表单背景叠加

2 个答案: