用于自动完成小部件的CSS

时间:2017-04-17 15:08:22

标签: jquery html css autocomplete

我想使用jqueryui.com的自动完成小部件(下面的代码) 正如您所看到的,他们正在使用外部样式表来创造一个好的风格。

如何更改“自动完成框”的样式?什么是身份证或班级?当然,自动填充建议没有格式化。

location /packs {
  root /var/app/current/public/packs;
}

有关详情,请参阅此处:http://jqueryui.com/autocomplete/#default

3 个答案:

答案 0 :(得分:1)

您可以通过在HTML中为其指定ID或类,或者如果要使用选择器设置所有自动填充框的样式,以任何方式设置输入框的样式

<ul class="ui-menu ui-autocomplete">
    <li class="ui-menu-item">Suggestion 1</li>
    <li class="ui-menu-item">Suggestion 2</li>
</ul>

自动填充建议显示为输入下方的列表。它的格式如下:

Table ZTAB: Key length > 120 (restricted functions)
Message no. DT214

Diagnosis

The key length, that is, the sum of the field lengths of all the key fields of the table, is greater than 120 bytes.

System Response

This is a warning.

Procedure

Note the following restricted fuctionality for this table:
- Table contents cannot be transported by specifying key values, at
  most, by specifying generic
  key values with a maximum length of 120 bytes.

The table cannot be used as the base table of a lock object if the total of
  the fields lengths of all key fields in the table is greater than 150 bytes.

为了将来参考,我强烈建议您熟悉浏览器的检查员,例如: Chrome DevTools或Firefox的Page Inspector。这可以帮助您自己解决HTML和CSS问题。

答案 1 :(得分:1)

您可以像这样访问窗口小部件的不同组件。香港专业教育学院为你准备了一个傻瓜。 https://plnkr.co/edit/zMwsXhXtElU7VkvbJSvK?p=preview

访问标签:

.ui-widget label{
/* styles */
}

访问插件的输入框:

.ui-widget input{
/* styles */
}

访问插件列表:

.ui-menu .ui-menu-item{
/* styles */
}

答案 2 :(得分:0)

自动填充框使用tags ID,并且它有一个名为ui-autocomplete-input的类,因此如果要修改该元素,可以在CSS中包含类ui-autocomplete-input。 / p>