Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/79.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 创建不带ul的下拉菜单_Html_Css - Fatal编程技术网
Fatal编程技术网
  • html/
  • Html 创建不带ul的下拉菜单

Html 创建不带ul的下拉菜单

html css

Html 创建不带ul的下拉菜单,html,css,Html,Css,我想创建一个下拉菜单，但遇到了一些问题： 实际上，我想创建它，而不需要在标记中添加标记 因此，代码： <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>JS Bin</title> </head> <body> <ul> <li><a>Coffee</a></li&g

我想创建一个下拉菜单，但遇到了一些问题：

实际上，我想创建它，而不需要在
    • 标记中添加
    标记 因此，代码：

    <!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <ul>
    <li><a>Coffee</a></li>
      <ul><li><a>Coffee 2</a></li></ul>
    <li><a>Tea</a></li>
    <li><a>Milk</a></li>
</ul> 
</body>
</html>
    您可以看到，
    Coffee 2
    不是下拉菜单，应该是咖啡菜单，请帮助我 无需在
    • 内制作
    标签

    jsbin链接：

    
JS-Bin

      

    • 咖啡
咖啡2
      • 

    • 茶
      • 

    • 牛奶
      • 

    
您可以在
  • 标记中使用标记，请参见上面的示例

    • 
JS-Bin

      

    • 咖啡
咖啡2
      • 

    • 茶
      • 

    • 牛奶
      • 

    
您可以在
  • 标记中使用标记，请参见上面的示例
    • 给你：

    <ul>
    <li class="dpdwn"><a>Coffee</a><div><a>Coffe 2</a></div></li>
    <li><a>Tea</a></li>
    <li><a>Milk</a></li>
</ul>

    但在我看来，你应该在
    li
    中使用
    ul
    。 下面是一个例子：

    <ul>
    <li class="dpdwn"><a>Coffee</a>
        <ul>
            <li><a>Coffe 2</a></li>
        </ul>
    </li>
    <li><a>Tea</a></li>
    <li><a>Milk</a></li>
</ul>

    给你：

    <ul>
    <li class="dpdwn"><a>Coffee</a><div><a>Coffe 2</a></div></li>
    <li><a>Tea</a></li>
    <li><a>Milk</a></li>
</ul>

    但在我看来，你应该在
    li
    中使用
    ul
    。 下面是一个例子：

    <ul>
    <li class="dpdwn"><a>Coffee</a>
        <ul>
            <li><a>Coffe 2</a></li>
        </ul>
    </li>
    <li><a>Tea</a></li>
    <li><a>Milk</a></li>
</ul>

    假设您的HTML结构在上面，我们可以看到，当我们尝试验证它时，该结构是无效的，并且不被接受。您可以从下面提供的屏幕截图中看到这一点

    除了您想要的是无效标记这一事实之外，CSS方面也不可能处理悬停状态以显示子菜单。当前标准中没有允许您在鼠标悬停在兄弟姐妹上时选择兄弟姐妹的选择器

    我的建议是遵循多年来的做法，什么是有效的标记，以及在可预见的未来它将是怎样的，并将
    ul
    嵌套在
    li

    中假设上面的HTML结构，我们可以看到，当我们尝试验证它时，这个结构是无效的，并且不被接受。您可以从下面提供的屏幕截图中看到这一点

    除了您想要的是无效标记这一事实之外，CSS方面也不可能处理悬停状态以显示子菜单。当前标准中没有允许您在鼠标悬停在兄弟姐妹上时选择兄弟姐妹的选择器

    我的建议是遵循多年来的做法，什么是有效的标记，以及在可预见的未来它将是怎样的，并将
    ul
    嵌套在
    li
    中。你可以使用
    dl
    和
    dt
    并相应地设置它们的样式，但我担心在这一点上你只是在用一个标签换另一个标签。与其他答案一样，您为什么试图避免使用
    ul
    和
    li
    。创建下拉菜单是这些标签非常擅长的事情

    <dl>
    <dt>Foo</dt>
    <dt>Bar</dt>
</dl>

    
福
酒吧
    您可以使用
    dl
    和
    dt
    并相应地设置它们的样式，但我担心在这一点上，您只是在用一个标签换另一个标签。与其他答案一样，您为什么试图避免使用
    ul
    和
    li
    。创建下拉菜单是这些标签非常擅长的事情

    <dl>
    <dt>Foo</dt>
    <dt>Bar</dt>
</dl>

    
福
酒吧

    您不能将
      作为
        或
        的子代，只有
        • 有效。。。。恐怕这是不可能的，你为什么不把ul加入到li中呢？如何更新JSBIN这是不可能的，因为这样做在语法上是无效的，这是不好的。你有没有理由不想在LI中加入UL？你为什么要这样做？将
        嵌套在
        • 中有什么问题？如果人们知道你为什么要努力完成某件事，他们就更有可能帮助你。作为
            或
            的孩子，你不能拥有
              ，只有
            • 是有效的。。。。恐怕这是不可能的，你为什么不把ul加入到li中呢？如何更新JSBIN这是不可能的，因为这样做在语法上是无效的，这是不好的。你有没有理由不想在LI中加入UL？你为什么要这样做？将
              嵌套在
              • 中有什么问题？如果人们知道你为什么要努力完成某件事，他们就更有可能帮助你。

              <dl>
    <dt>Foo</dt>
    <dt>Bar</dt>
</dl>