选择的菜单突出显示ASP.Net Web窗体

时间:2015-09-30 04:44:07

标签: css asp.net webforms

我在TruckData页面上有这个代码:

<!-- BEGIN SIDEBAR -->
<div class="left side-menu" style="background: #99CCFF">
    <div class="body rows scroll-y" style="background: #99CCFF; margin-top: 50px; padding-top: 40px">

        <!-- Sidebar menu -->               
        <div id="sidebar-menu">
            <ul>
                <li>
                    <asp:HyperLink ID="hyperlink_TruckData" runat="server" Text="Truck Data" NavigateUrl="~/View/TruckData.aspx" Font-Underline="false" style="font-size: 18px; color: black">
                        <i class="glyphicon glyphicon-info-sign" style="color:black; background: #E8D73E"></i> 
                        Truck Data</asp:HyperLink>
                </li>
                <li>
                    <asp:HyperLink ID="hyperlink_MaintenanceRecord" runat="server"  NavigateUrl="~/View/MaintenanceRecord.aspx" Font-Underline="false" style="font-size: 18px; color: black">
                        <i class="glyphicon glyphicon-info-sign" style="color:black"> </i>
                        Maintenance Record</asp:HyperLink> 
                </li>
                <li>
                    <asp:HyperLink ID="hyperlink_MaintenanceSchedule" runat="server" Text="Maintenance Schedule" NavigateUrl="~/View/MaintenanceSchedule.aspx" Font-Underline="false" style="font-size: 18px; color: black">
                        <i class="glyphicon glyphicon-calendar" style="color:black"> </i>
                        Maintenance Schedule </asp:HyperLink>
                </li>
                <li>
                    <asp:hyperlink id="hyperlink_Inspection" runat="server" text="inspection" navigateurl="~/view/inspection.aspx" font-underline="false" style="font-size: 18px; color: black">
                        <i class="glyphicon glyphicon-calendar" style="color:black"></i>
                        Inspection </asp:hyperlink>
                </li>
            </ul>
        </div><!-- End div #sidebar-menu -->
    </div><!-- End div .body .rows .scroll-y -->
</div>
<!-- END SIDEBAR -->

这是我的CSS:

.row a:hover {
    background-color: #6699FF;
}

.row a:active {
    background-color: #;
}

.row a:visited {
    background-color: #;
}

.row a:selected {
    background-color: #63D130;
}

这是输出:

enter image description here

在图片上,仅突出显示glyphicon。我想突出整体。如何突出显示整个Truck Data菜单?在普通的HTML中它可以工作,但在ASP.Net中,只突出显示图标。

0 个答案:

没有答案