Vous avez trouvé ce tutoriel intéressant ? Recommandez le en cliquant sur le bouton +1    

Listes & catégories

Tutoriel publié le et mis à jour le
Tutoriel en Français

Exemple de liste avec séparatif ou découpée en catégories

<!DOCTYPE html> 
<html> 
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1"> 
		<title>Exemple de liste avec catégorie</title> 
		<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
		<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
		<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
	</head> 
	<body> 
		<div data-role="page">
			<div data-role="header">
				<h1>Exemple de liste avec catégorie</h1>
			</div><!-- /header -->
			<div data-role="content">	
				<ul data-role="listview">
					<li data-role="list-divider">A</li>
					<li><a href="index.html">Adam Kinkaid</a></li>
					<li><a href="index.html">Alex Wickerham</a></li>
					<li><a href="index.html">Avery Johnson</a></li>
					<li data-role="list-divider">B</li>
					<li><a href="index.html">Bob Cabot</a></li>
					<li data-role="list-divider">C</li>
					<li><a href="index.html">Caleb Booth</a></li>
					<li><a href="index.html">Christopher Adams</a></li>
					<li><a href="index.html">Culver James</a></li>
					<li data-role="list-divider">D</li>
					<li><a href="index.html">David Walsh</a></li>
					<li><a href="index.html">Drake Alfred</a></li>
					<li data-role="list-divider">E</li>
					<li><a href="index.html">Elizabeth Bacon</a></li>
					<li><a href="index.html">Emery Parker</a></li>
					<li><a href="index.html">Enid Voldon</a></li>
					<li data-role="list-divider">F</li>
					<li><a href="index.html">Francis Wall</a></li>
					<li data-role="list-divider">G</li>
					<li><a href="index.html">Graham Smith</a></li>
					<li><a href="index.html">Greta Peete</a></li>
					<li data-role="list-divider">H</li>
					<li><a href="index.html">Harvey Walls</a></li>
					<li data-role="list-divider">M</li>
					<li><a href="index.html">Mike Farnsworth</a></li>
					<li><a href="index.html">Murray Vanderbuilt</a></li>
					<li data-role="list-divider">N</li>
					<li><a href="index.html">Nathan Williams</a></li>
					<li data-role="list-divider">P</li>
					<li><a href="index.html">Paul Baker</a></li>
					<li><a href="index.html">Pete Mason</a></li>
					<li data-role="list-divider">R</li>
					<li><a href="index.html">Rod Tarker</a></li>
					<li data-role="list-divider">S</li>
					<li><a href="index.html">Sawyer Wakefield</a></li>
				</ul>
			</div><!-- /content -->
			<div data-role="footer">
				<h4>Contenu du pied de page</h4>
			</div><!-- /footer -->
		</div><!-- /page -->
	</body>
</html>

Voir le résultat : Exemple de liste avec séparatif.