<div class="demo-preview-block"> <h3>Ordered</h3> <ol> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li>Item 5</li> </ol> <h3>Unordered</h3> <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li>Item 5</li> </ul> <h3>Inlined</h3> <ul class="mdl-list--inline"> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li>Item 5</li> </ul> <h2>Styled List View</h2> <p> <div class="List"> <p class="mdl-typography-Body-2">Contacts</p> <div class="mdl-list--styled-view"> <ul> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Ali Connors</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Sandra Williams</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Trevor Hansen</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Britta Holt</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">David Park</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Jennifer Adams</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Frank Connors</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Sandra Williams</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Scott Michaels</span> </li> <li> <span class="mdl-list-view--avatar"></span> <span class="mdl-list-view--name">Matt Connors</span> </li> </ul> </div> </div> </p> </div>