【发布时间】：2017-12-14 20:46:55
【问题描述】：
问题是，每当我点击选择下拉菜单时，它都会在<div> 后面打开。我尝试了 z-index，但它不起作用。
body {
font: 1.5em Arial;
background-image: url('prague2.jpeg');
background-size: cover;
}
.top {
opacity: 0.8;
font-size: 65px;
font-family: Courier new;
text-align: center;
background: #EBA23C;
width: 100%;
}
ul {
float: right;
margin: 0px;
padding: 0px;
list-style: none;
}
ul li {
float: left;
width: 200px;
height: 40px;
background-color: #F05050;
text-align: center;
font-size: 20px;
line-height: 40px;
margin-right: 2px;
}
ul li a {
text-decoration: none;
color: white;
display: block;
}
ul li a:hover {
background-color: #C6AEF0;
}
ul li ul li {
display: none;
}
ul li:hover ul li {
display: block;
}
.container {
line-height: 35px;
font-style: Lucida Console;
font-size: 22px;
opacity: 0.8;
background: #F0E3CA;
float: left;
width: 450px;
height: 630px;
border: 2px solid;
border-radius: 15px;
}
.container-inner {
border-radius: 15px;
background: #F05050;
text-align: center;
width: 450px;
height: 40px;
float: left;
border: 2px solid;
}
.container2 {
background-color: #ccc;
width: 650px;
margin-left: 780px;
margin-top: 30px;
font-size: 50px;
font-family: Courier New;
opacity: 0.7;
text-align: center;
border: dashed;
}
.bachelor {
font-size: 40px;
background-color: #ccc;
border: 2px solid;
width: 800px;
height: 100px;
margin-left: 710px;
margin-right: 650px;
text-align: center;
opacity: 0.6;
font-family: Courier New;
font-style: bold;
}<div class="top">Study in Czech Republic</div><br>
<ul>
<li><a>Home</a></li>
<li><a>News</a></li>
<li><a>Czech Republic</a>
<ul>
<li><a>Facts and figures</a></li>
<li><a>Area</a></li>
<li><a>Climate</a></li>
</ul>
</li>
<li><a>Study</a>
<ul>
<li><a>How to apply</a></li>
<li><a>Programmes</a></li>
<li><a>Scholarships</a></li>
<li><a>Tuition fees</a></li>
</ul>
</li>
<li><a>Living</a>
<ul>
<li><a>Arrival</a></li>
<li><a>Living costs</a></li>
<li><a>Work</a></li>
</ul>
</li>
<li><a>Contact</a></li>
</ul>
<div class="container-inner">Why study in the Czech Republic</div><br><br>
<div class="container">These days, over 37,000 foreign students are studying in the Czech Republic; and as their universities continue to offer a ton of English-taught courses, more and more students are finding interesting options there. But if you decide to go there, you’ll
find a large, exciting community of international students just like you. Universities in the Czech Republic also offer a wide range of programmes at the Bachelor’s, Master’s, and Ph.D level; and each university is accredited, meaning that their courses
are recognised by companies and organisations all over the country and throughout Europe. In the Czech Republic, you can find one of the oldest traditions of higher education, dating all the way back to the 14th century. It probably also means the universities
are haunted.</div>
<div class="container2">
EXPERIENCE STUDYING IN THE HEART OF EUROPE
</div><br>
<div class="bachelor">Bachelor's Degrees in Czech Republic</div>问题是，每当我点击选择下拉菜单时，它都会在后面打开。我曾尝试过 z-index，但它不起作用。
【问题讨论】：
-
您的示例 HTML 已损坏，您所有的 HTML 都在
<head>内，这是拼写错误吗？您可以使用 图标并为您的问题创建一个工作示例吗？ -
我 1 个月前开始编写代码，但我没有足够的经验，这就是我编写错误代码的原因。我可以删除头部标签吗？
-
欢迎来到 Stack Overflow！请edit您的代码将其减少为您的问题的minimal reproducible example。您当前的代码包含许多与您的问题无关的内容 - 一个最小样本通常看起来类似于一个好的单元测试：只执行一项任务，并为可重复性指定输入值。
-
@ParvizMuxcanov 我无法编辑您的代码，因为有待批准的编辑等待批准（所以也许有人已经修复了它？）。
-
不，我正在尝试更改此设置，但不幸的是还不行
标签： html css drop-down-menu