typeahead.js找不到修改它的样式，或者我可以从CSS覆盖html元素样式吗？

Question

typeahead.js是一个文件，但是由于某种原因，它添加了具有'style'属性的html元素，我正在尝试修复z-index，但在此处的type-ahead生成的元素中对其进行了定义。我看不到typeahead.js中定义的样式。我如何将突出显示的内容设置为z-index = 9999999，因为此主题中的某些元素为99999（烦人）

我们正在尝试将菜单移至某些按钮上方，但我不知道如何修改typeahead生成的html。为什么他们在这里不将CSS与typeahead.css文件一起使用？看起来有点奇怪。

谢谢，院长

发现这个项目（https://github.com/corejavascript/typeahead.js）是一个分支，并且升级到1.3.1存在相同的问题

Answer 1

有一些内置的类名（如果我记得的话，没有记录），您可以用来覆盖默认样式。这是我的一个项目的示例。我认为tt-menu类是您想要的类。它控制整个弹出菜单的整体。

/*****************************
 * Twitter Typeahead Styling *
 *****************************/
.twitter-typeahead {
    width: 100%;
}

.tt-hint {
  color: #999;
}

.tt-menu {
  width: 422px;
  margin-top: 4px;
  padding: 4px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
     -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
          box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
  padding: 3px 20px;
  line-height: 24px;
}

.tt-suggestion:hover {
  background-color: #ddd;
}

.tt-suggestion p {
  margin: 0;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;

}

要更改生成的HTML，需要分叉项目，修改代码，然后使用定制版本。这不是不可能，但是修改typeahead.js的内部工作方式可能不是您想要的。