Plateformes d'assistanceDiscussions & Opinions des Communautés
|
|
|
|
Meilleures réponses pour « Liste à puces en HTML » dans :
[Windows] Obtenir la liste des fichiers d'un dossier VoirLister le contenu d'un dossier
Voici une astuce simple qui permet de lister le nom des fichiers contenus dans un répertoire.
Vous pourrez obtenir en un clic les titres de vos chansons, de vos photos, etc. dans un fichier...
Espace en HTML VoirEn HTML, les espaces consécutifs sont ignorés par les navigateurs, au même titre que les retours chariots ou les tabulations.
Pour insérer plusieurs espaces consécutifs, il est nécessaire d'utiliser une entité HTML spécifique, appelée espace...
Télécharger HTML Tidy VoirHTML Tidy est un utilitaire permettant de vérifier et d'optimiser tout code HTML.
La version originale de cet utilitaire s'utilise en mode de commande uniquement. La présente version, appelée "GUI Tidy", possède une interface graphique.
Notez...
Listes et énumérations en HTML VoirLes listes
Une liste est un paragraphe structuré contenant une suite d'articles.
Le langage HTML définit trois types de listes :
La liste ordonnée ;
La liste non ordonnée ;
La liste de définition.
Liste ordonnée
Conteneur
Type de...
Les balises HTML VoirHTML, un langage à balises
Le HTML n'est pas un langage de programmation. Il s'agit d'un langage permettant de décrire la mise en page et la forme d'un contenu rédigé en texte simple.
Une page HTML est ainsi un simple fichier texte...
Caractères spéciaux HTML VoirCodage des caractères spéciaux
Le standard HTML demande de respecter le codage des caractères ASCII 7 bits, c'est-à-dire que les caractères accentués ne sont pas autorisés. Il faut pour cela utiliser un codage particulier.
Pour...
Bonjour,
|
Voila ce que j'ai fait mais la largeur de l'mage 20px par 20px maxi, Cela me remplace la puce.
.element_menu ul/*Toutes les listes à puces se trouvant dans un menu*/
{
list-style-image:url("images/bouton.gif");/*On change l'apparence des puces*/
padding:0px;/*Tout les côtés ont une marge intérieur de 0 pixels*/
padding-left:30px;/*...mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20pixels*/
margin:0px;/*Idem pour margin, ça nous évite d'avoir à en écrire 4(margin-left, margin-right...)*/
margin-bottom:5px;/*Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais
tous les autres sont à 0 px*/
}
<body>
<div id="en_tete"><!--Case vide pour le moment voir avec le CSS-->
</div>
<div id="menu"><!--Cadre englobant tous les sous-menus 'en bleu marine sur le schéma)-->
<div class="element_menu"><!--Cadre correspondant à un sous-menu -->
<h3>Titre menu</h3><!--Titre du sous_menu-->
<ul><!--Texte du premier menu-->
<li><a href="page1.html"><acronym title="La maison de Pépé !">La maison
</acronym></a></li><!--Liste du sous_menu-->
<li><a href="page2.html"><acronym title="Cliquez pour voir">
Une surprise</acronym></a></li>
<li><a href="formulaire.html">Lien</a></li>
</ul>
</div>
<div class="element_menu">
<h3>Titre menu</h3><!--Texte du second menu-->
<ul>
<li><a href="page4.html">Lien</a></li>
<li><a href="page5.html">Lien</a></li>
<li><a href="page6.html">Lien</a></li>
</ul>
</div>
</div>
</div>
</body>
Tu me tient au courant, je débute i.element_menu ul/*Toutes les listes à puces se trouvant dans un menu*/> |
C'est possible.
background : url(images/bouton.gif) no-repeat 0 0;L'image étant dans les liens, elle est “cliquable”. Comme tu sembles avoir déjà assimilé l'utilisation des listes et plutôt qu'un long discours, je te propose de tester cet exemple dans lequel j'ai ajouté un effet sur les puces en image. -- |

