我一直在处理网页，但由于一些问题，我不知道为什么我的下拉列表不起作用。但是，当放置在 div 之外时，它确实有效。如果有人可以帮助我，我将不胜感激。 html 和 css 文件附在下面。
下面是html代码:
@charset "utf-8";
/* CSS Document */
body {
padding: 0;
margin: 0;
background-image: url("background.jpg");
background-repeat: no-repeat;
}
canvas {
border: 1px dashed rgb(200, 200, 200);
}
.outer {
display: table;
position: absolute;
height: 100%;
width: 100%;
}
.middle {
display: table-cell;
vertical-align: middle;
}
#div_canvas {
float: left;
width: 900px;
height: 600px;
background-color: #FFF;
margin-left: 50px;
padding: 0;
}
#div_menu {
background-color: rgba(255, 255, 255, 0.4);
border-radius: 10px;
border: 1px solid gray;
float: right;
width: 300px;
height: 600px;
word-wrap: break-word;
margin-right: 50px;
}<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="mycss.css">
</head>
<body>
<!--Menu-->
<div class="outer">
<div class="middle">
<div id="div_menu">
<br/>
<center>
<select id="action">
<option value="1">Line</option>
<option value="2">Freehand</option>
</select>
</center>
</div>
</div>
</div>
<!--Canvas-->
<div class="outer">
<div class="middle">
<center>
<div id="div_canvas">
<canvas id="canvas" width="899" height="599"></canvas>
</div>
</center>
</div>
</div>
</body>
</html>最佳答案
你的第二个 .outer 在你的选择框前面。
给第一个.outer一个z-index: 1;
关于html选择下拉列表在div中不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29258001/