显示项目符号的自动完成列表

Question

我有一个带有Ajax Control Toolkit AutoCompleteExtender的TextBox，我在格式化方面遇到了一些问题。

如果我省略CompletionListCssClass，CompletionListItemCssClass，CompletionListHighlightedItemCssClass值，则显示正常。但我只需要将自动填充文本与左侧对齐，以及TextBox的大小。

如果我在site.css中设置这些值：

.autocomplete_listItem
{
    background-color: #222;
    color: #cfdbe6;
}

.autocomplete_highlightedListItem
{
    background-color: #999;
    color: #111;
}

.autocomplete_completionListElement
{

}

然后我在列表上的子弹。

如何让子弹不显示，将列表对齐到TextBox下方，列表项左对齐，以及与TextBox匹配的大小？

Answer 1

删除项目符号所需要做的就是为每个班级添加list-style-type:none：

.autocomplete_listItem
{
    background-color: #222;
    color: #cfdbe6;
    list-style-type:none;
}

.autocomplete_highlightedListItem
{
    background-color: #999;
    color: #111;
    list-style-type:none;
}

.autocomplete_completionListElement
{
    list-style-type:none;
}

这是因为AJAX扩展程序将自动填充结果作为项目符号列表返回 - 因此，如果您自定义样式，则需要确保并隐藏这些项目符号。

为了告诉您如何将其与其他元素正确对齐，我需要查看您的标记（问题中未包含该标记）。