Question

我在asp.net中有以下菜单：

<div id="left">
    <div id="menus" runat="server">
        <div id="left_menu">
            <div class="abc">
            </div>
            <div id="os">
            </div>
            <div class="btm">
            </div>
        </div>
        <div id="left_menu">
            <div class="cde">
            </div>
            <div id="l">
            </div>
            <div class="G">
            </div>
        </div>
    </div>

我想在菜单前添加虚线，因此行应该与菜单一样长。我在网上搜索，在这里找不到如何在菜单前添加虚线。我在这里有虚线css：

#horizontal_dotted_line
{
    border-top: 1px dotted #f00;
    color: black;
    background-color: #fff;   
    height: 1px;   
    width:50%;
}

但是我应该在哪里放置div标签horizontal_dotted_line 所以它出现在菜单前面？

Answer 1

您的菜单是垂直的，您的线条是水平的，但您希望您的线条与菜单一样长？

您确定不需要垂直线吗？只需将CSS类的目标ID从horizontal_dotted_line更改为menus，然后从边框顶部更改为左边框。（如果这是一个.NET控件，让它以一个类而不是一个ID为目标，因为.NET Id会有所不同）

#menus {
    border-left: 1px dotted #f00;
    color: black;
    background-color: #fff;   
    height: 1px;   
    width:50%;
}

Answer 2

试试这个：

<div id="left">
    <div id="vertical-dotted-line">
        <div id="menus" runat="server">

使用css：

#vertical-dotted-line{
    border-left: 1px dotted #f00;
    overflow: hidden;
}

如何在菜单前添加虚线

2 个答案: