Html 为什么橙色下拉列表旁边有一个灰色块？

我已经找了2个小时了，但是我想不出来，在橙色下拉框旁边有一个灰色的框，我无法摆脱。我可能认为它可以和css一起做，但我还不太擅长编码，因为我只编码了3个月，请帮助我

.dropbtn{ 背景颜色：橙色； 颜色：白色； 填充：16px； 字体大小：16px； 边界：无； 光标：指针； } .下拉列表{ 位置：相对位置； 显示：内联块； } .下拉内容{ 显示：无； 位置：绝对位置； 背景色：f9f9f9； 最小宽度：160px； 盒影：0px 8px 16px 0px rgba0,0,0.2； z指数：1； } .下拉内容a{ 颜色：黑色； 填充：12px 16px； 文字装饰：无； 显示：块； } .下拉列表内容a：悬停 {背景色：橙色} .下拉：悬停.下拉内容{ 显示：块； } .dropdown:悬停.dropbtn{ 背景色：000000； } 名称

---

您的按钮上缺少一个结束标记。试一试下面的修正

.dropbtn{ 背景颜色：橙色； 颜色：白色； 填充：16px； 字体大小：16px； 边界：无； 光标：指针； } .下拉列表{ 位置：相对位置； 显示：内联块； } .下拉内容{ 显示：无； 位置：绝对位置； 背景色：f9f9f9； 最小宽度：160px； 盒影：0px 8px 16px 0px rgba0,0,0.2； z指数：1； } .下拉内容a{ 颜色：黑色； 填充：12px 16px； 文字装饰：无； 显示：块； } .下拉列表内容a：悬停 {背景色：橙色} .下拉：悬停.下拉内容{ 显示：块； } .dropdown:悬停.dropbtn{ 背景色：000000； } 名称 您缺少显示在下拉内容元素之前的按钮的结束标记：

<!-- Ensure your button is closed PRIOR to the rest of your content -->
<button class="dropbtn">name</button>
<div class="dropdown-content">
  <a href="#">name</a>
  <!-- Additional names omitted for brevity -->
</div>

---

无效的语法通常会产生类似这样的标记问题，因为如果您没有明确告知，浏览器将无法知道按钮何时停止。

您没有关闭按钮标记。它应该是一个名字而不是名字谢谢，你救了我几个小时的搜索！