仅对 <ul> 元素设置 border-radius 无效，是因为它默认无背景色和可见边框；需同时设置 background-color（或 border）才能使圆角视觉生效。

仅对 `

` 元素设置 `border-radius` 无效，是因为它默认无背景色和可见边框；需同时设置 `background-color`（或 `border`）才能使圆角视觉生效。

在 CSS 中，border-radius 属性本身是完全支持 <ul> 这类块级容器的——问题不在于“不能用”，而在于“看不见”。你的样式：

#myMenu {
  margin: 0;
  padding: 0;
  list-style: none;
  border-radius: 10px;
  border: 5px solid transparent; /* ❌ 透明边框无法呈现圆角轮廓 */
}

虽然声明了 border-radius: 10px，但由于：

• #myMenu 没有设置 background-color，其内容（<li>）又继承了父级 .dropdown-content 的深灰背景（rgb(62, 62, 62)），导致 <ul> 自身背景完全透明，视觉上“消失”；
• border: 5px solid transparent 不提供视觉边界，圆角失去承载基础。

✅ 正确做法：为 #myMenu 显式添加不透明背景色（推荐与父容器协调），并可选添加浅色边框增强层次感：


Html2md
使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...
下载

#myMenu {
  margin: 0;
  padding: 8px 0; /* 建议保留垂直内边距，避免首尾项贴边 */
  list-style: none;
  background-color: rgb(62, 62, 62); /* ✅ 关键：赋予可见背景 */
  border-radius: 10px;                /* ✅ 圆角现在生效 */
  overflow: hidden;                   /* ✅ 防止子元素溢出圆角（如悬停阴影） */
}

? 补充建议：

立即学习“前端免费学习笔记（深入）”；

• 添加 overflow: hidden 可确保内部 <li> 或伪元素（如 ::before）不会突破圆角区域；
• 若需更精细控制（如仅首尾项圆角），可改用 border-top-left-radius/border-bottom-right-radius 等单侧属性；
• 避免依赖 transparent 边框实现“隐形边框”——它不参与渲染轮廓，border-radius 将无从体现。

最终效果：<ul> 容器将以统一的 10px 圆角呈现，与下拉菜单整体设计自然融合。