5568 sujets

Sémantique web et HTML

[Résolu, Solution]Des puces qui ne s'affichent pas ?

Bonsoir tlm,

J'ai entré ce code dans ma page *html:


<li type="square">carré plein noir</li>
<li type="disc">losange plein noir</li>
<li type="circle">cercle noir vide</li>


Pourtant rien ne s'affiche, pas la moindre petite puce à l'horizon !!!

J'ai fait un test sur une page vierge, et là tout le monde est au rendez-vous.

Mon code javasript serait-il en cause ?:

			<!--
		window.onload=montre;
		function montre(id) {
		var d = document.getElementById(id);
			for (var i = 1; i<=10; i++) {
				if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).[#red]style.display='none';[/#] }
			}
		if (d) {d.style.display='block';}
		}
		//-->


Je ne crois pas, je ne connais encore rien à ce langage ! mais on sait jamais.

Qlq sait-il ce qui se passe ?

merci de votre aide.
Modifié le 03 Jan 2005 - 22:54
Eureka !

Cela venait d'une définition "li" dans mon css que j'avais oublié:
list-style-type: none;


Par contre, J'ai besoin de la conserver pour mon menu et j'ai besoin de la déconnecter provisoirement pour un affichage ponctuel des puces dans un exemple sur ma apge Web.

Ces lignes ne fonctionnent pas:


<li type="square">carré plein noir</li>
<li type="disc">losange plein noir</li>
<li type="circle">cercle noir vide</li>


Quelqu'un a-t-il une piste ?

Merci !
Modifié le 03 Jan 2005 - 00:28
Es-tu bien certain que:
<li type="square">carré plein noir</li>

fonctionne? "type="square"" est-il un attribut css ou html?

Dans ton post suivant je ne suis sûr que l'utilisation de javascript soit bien pertinente pour styler des listes, css offre plusieurs solutions pour la gestion des listes.

Pompage vient par ailleurs de changer de "peau" avec en particulier une nouvelle traduction très interressante: Domptez vos puces, dressez des listes dont je te conseille la lecture.
Bonsoir à tout le monde,

Le lien de igor est trés interressant.

je relance le post car je cherche toujours à désactiver momentanément la définition de li dans le fichier CSS.

Quelqu'un as-t-il une idée ?

merci de m'aider.
Ouf!

Deux jours de recherches et voilà le résultat;

Code CSS:


.circle
{
   list-style-type: circle;
}
.square
{
   list-style-type: square;
}
.disc
{
   list-style-type: disc;
}


Code XHTML:


<li class="square">carré plein noir</li>
<li class="disc">rond plein noir</li>
<li class="circle">cercle noir vide</li>


La solution était évidente, il ne s'agissait pas de désactiver la défintion de "li" dans mon fichier CSS, mais bel et bien de redéfinir mes trois "class" pour chaque puce.

Quand la solution vous saute aux yeux, on ne la vois pas toujours....!
Modifié le 03 Jan 2005 - 22:49
Et j'ajoute l'élément "margin-left: 2em;" pour éviter que mes puces ne sortes de mon bloc. 


.circle

{

   list-style-type: circle;
   margin-left: 2em;

}

.square

{

   list-style-type: square;
   margin-left: 2em;

}

.disc

{

   list-style-type: disc;
   margin-left: 2em;

}


C'est fou ce que l'on peut apprendre en lisant:
http://pompage.net/pompe/listes/
Ce billet est trés instructif.
Pour éviter que ça sorte, tu peux mettre list-style-position: inside, c'est plus propre. Et pour racourcir le tout :

list-style: inside circle;
Sujet clos
Aller à