Foundation Lists
In HTML, an unordered list (<ul>
) example is as follows:
<ul> <li>List item</li> <li>List item</li> <li>List item</li>
<li>List item</li></ul>
Result:
- List item
- List item
- List item
- List item
Circle Bullets
In Foundation, the prefix symbol for an unordered list (<ul>
) is a circle, using the .circle class, as shown below:
<ul class="circle"> <li>List item</li> ...</ul>
Square Bullets
Square bullet prefixes use the .square class:
<ul class="square"> <li>List item</li> ...</ul>
No Bullets
If you do not need bullets, you can use the .no-bullet class:
<ul class="no-bullet"> <li>List item</li> ...</ul>
If you need a horizontal list, you can add the .inline-list class to <ul>
:
<ul class="inline-list">
List Menus
Some web pages may require list menus.
In HTML, list menus are defined using the unordered list <ul>
, for example:
<ul> <li><a href="#">Home</a></li> <li><a
href="#">Menu 1</a></li> <li><a href="#">Menu 2</a></li>
<li><a href="#">Menu 3</a></li></ul>
Result: