我似乎无法弄清楚为什么我的自定义UL LI选择框出现在其他HTML元素后面。你如何解决这个问题,当用户点击选择框时,它会出现在其他页面元素的顶部?
这里是手头的问题的一个画面:
下面是一个描绘所期望的结果:
这里是有问题的CSS:
* {
font-family: Segoe UI;
font-size: 9pt;
}
.select {
background: url(arrow.png) no-repeat scroll right top;
border: 1px solid rgb(170,170,170);
width: 180px;
padding: 3px;
position: absolute;
}
.select:hover {
cursor: pointer;
border-color: rgb(112,112,112);
}
.select ul {
list-style-type: none;
margin: 0;
padding: 0;
cursor: pointer;
position: relative;
background: red;
}
.select ul li {
display: none;
padding: 1px;
font-weight: normal;
}
.select ul li:hover {
background: rgb(112,146,190);
color: #FFF;
}
.selected {
background: rgb(195,195,195);
}
HTML:
Numbers
- 1234
- 5678
- 9101
Letters
- abcd
- efgh
- ijkl
Fruits
- apples
- bananas
- oranges
+0
你的小提琴不起作用。 –