Represent a list.

In this module, double-click the green appender (loop field) to add list items.

Then insert other modules as each list item.

It can also handle complex list representations such as multi-level list structures.


## Types of list expressions you can choose from

In addition to the standard list format, several list presentation formats can be selected.


### standard list

```html
<ul>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List item 3</li>
</ul>
```

### vertical list

```html
<ul class="px2-horizontal-list">
<li>Vertical list item 1</li>
<li>Vertical list item 2</li>
<li>Vertical list item 3</li>
</ul>
```

### horizontal list

```html
<ul class="px2-horizontal-list">
<li>Horizontal list item 1</li>
<li>Horizontal list item 2</li>
<li>Horizontal list item 3</li>
</ul>
```

#### Horizontal list (left aligned)

```html
<ul class="px2-horizontal-list px2-horizontal-list--left">
<li>Horizontal list item 1</li>
<li>Horizontal list item 2</li>
<li>Horizontal list item 3</li>
</ul>
```


#### Horizontal list (centered)

```html
<ul class="px2-horizontal-list px2-horizontal-list--center">
<li>Horizontal list item 1</li>
<li>Horizontal list item 2</li>
<li>Horizontal list item 3</li>
</ul>
```


#### Horizontal list (right justified)

```html
<ul class="px2-horizontal-list px2-horizontal-list--right">
<li>Horizontal list item 1</li>
<li>Horizontal list item 2</li>
<li>Horizontal list item 3</li>
</ul>
```



### Annotation list

```html
<ul class="px2-note-list">
<li>Annotation List Item 1</li>
<li>Annotation list item 2</li>
<li>Annotation list item 3</li>
</ul>
```