jquery - 如何更改jquery上下文菜单的样式

Question

我正在尝试将 jquery 上下文菜单与 Jqgrid 一起使用。我可以通过右键单击获得上下文菜单选项，但我无法更改上下文菜单的默认样式。例如，如果我的上下文菜单选项比我不想要的下一行中的某些词更重要..

这是 HTML..

<div class="contextMenu" id="myMenu1" style="display:none; width:auto;">
    <ul style="width: 200px">
     <li id="Reservation">
            <span class="ui-icon ui-icon-pencil" style="float:left"></span>
            <span style="font-size:11px; font-family:Verdana">Reservation Options</span>
        </li>
        <li id="CheckIn">
            <span class="ui-icon ui-icon-pencil" style="float:left"></span>
            <span style="font-size:11px; font-family:Verdana">CheckIn</span>
        </li>
    </ul>
</div>

现在在上面的上下文菜单中，第一个选项 Reservation Options 我得到了两行我不想要的.. 请帮我更新 css。我试图增加 ul 列表的宽度，但它不起作用.. 谢谢..

Answer 1

创建一个新的 CSS 文件并向其中添加所有样式并包含它；

要覆盖内联样式，您必须使用 !important;

.contextMenu
{
   /*Your context menu styling here*/
}

.contextMenu ul
{
   width: 500px !important; /*or Your desired width here */
}

.contextMenu ul li
{
   white-space: nowarp;
}

希望对您有所帮助。