当它具有nowrap属性时，如何让ul按窗口宽度重新调整大小

Question

正如我的标题所写，现在我有了一个由ul li制作的菜单，我不会因为窗口太窄而让菜单中断。但一旦它附加了"nowrap"属性，它就不会再随窗口重新调整大小，我该如何使它不仅是nowrap，而且没有换行符。

<ul class="parallMenu">
<li>item1</li>
<li>item2</li>
</ul>

.parallMenu{
   list-style:none;
   margin-left:0;
   padding-left:0;
   text-decoration:none;
   white-space:npwrap;
   width:100%;
}
.parallMenu li{
   width:120px;
   min-width:30px;
   display:inline-block;
}

谢谢！

Answer 1

因此，

$(".parallMenu").toggleClass("nowrap");
.nowrap
{
  width: 500px !important; /*(fixed value)*/;
}

的其他属性也是如此

或

<ul id="MyMenu" class="parallMenu wrap"></ul>
$("#MyMenu").toggleClass("wrap");
$("#MyMenu").toggleClass("nowrap");
.wrap
{
  white-space :wrap;
}
.nowrap
{
 white-space: nowrap;
}

并具有不同的类别，为u.定义不同的内容

编辑：

如果没有脚本，请使用CSS媒体屏幕。

@media (min-width: 768px) { 
   .parallMenu
   {
      white-space:nowrap;
   }
}