2

This is an unfortunate question, but I don't see any other way around it.

Basically, I am using Kendo UI panelbar to create expandable lists. The problem is, when you use an <ol> as the sublist, the panelbar functionality doesn't work.

Example in Fiddle: http://jsfiddle.net/b3y62uzr/2/

HTML:

<ul id="panelBar1">
    <li>
        Item 1
            <ul>
                <li>Sub Item 1</li>
                <li>Sub Item 2</li>
            </ul>
    </li>
    <li>Item 2
            <ol>
                <li>Sub Item 1</li>
                <li>Sub Item 2</li>
            </ol>
    </li>
</ul>

You can see that the first item can be expanded/collapsed properly, but the second item is always open and can't be interacted with.

In my application, I need the sub-list in my expanded section to be numbered rather than bulleted. (I modified the Kendo Panelbar styling to show the bullets).

So the question is: Is it possible to make an <ul> use numbers instead of bullets?

Edit: Use this Fiddle if you want for your answer: https://jsfiddle.net/1h2kLqu4/1/

4

1 回答 1

12

是的,您可以list-style-type在无序列表上使用 CSS 属性。

你可以这样定位它:

ul li{
    list-style-type: decimal;
}

这是一个向您展示结果的小提琴。

于 2015-07-10T19:00:23.357 回答