开发者

Unordered list in HTML5 with a list/group name

开发者 https://www.devze.com 2023-03-15 10:56 出处:网络
How would you create an unordered开发者_开发知识库 list of items in HTML5 with a group name at the top? The items should look indented.

How would you create an unordered开发者_开发知识库 list of items in HTML5 with a group name at the top? The items should look indented.

Ex:

GroupName1
    Item1
    Item2
    Item3
GroupName2
    Item4
    Item5


Why not just do a list within a list?

<ul>
  <li>
    Group 1
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
    </ul>
  </li>
  <li>
    Group 2
    <ul>
      <li>Item 4</li>
      <li>Item 5</li>
    </ul>
  </li>
</ul>


I reckon scurker’s answer is the way to go, but if your groups were really separate from each other, and thus didn’t really make sense in one big list, you could do this:

<section>
    <h1>GroupName1</h1>

    <ul>
        <li>Item1</li>
        <li>Item2</li>
        <li>Item3</li>
    </ul>
</section>

<section>
    <h1>GroupName2</h1>

    <ul>
        <li>Item4</li>
        <li>Item5</li>
    </ul>
</section>
0

精彩评论

暂无评论...
验证码 换一张
取 消