CSS pour et ?

2 réponses
Avatar
AlainL
Bonsoir,

Comment feriez-vous pour obtenir dans toute la liste les noms de famille
en gras, les noms de genre en "normal" et les noms d'espèces en italique
? Merci
alainL
_________________________________________________________________________
<ul>
<li/>Famille :
<ul>
<li>Genre : Espèce1, Espèce2</li>
<li>Genre : Espèce3, Espèce4</li>
</ul>
</li>

<li/>Amaryllidaceae :
<ul>
<li>Allium : Allium ericetorum, Allium ursinum</li>
<li>Narcissus : Narcissus bulbocodium, Narcissus pseudonarcissus</li>
</ul>
</li>
/ul>
__________________________________________________________________________

---
L'absence de virus dans ce courrier électronique a été vérifiée par le logiciel antivirus Avast.
https://www.avast.com/antivirus

2 réponses

Avatar
Duzz'
Le 11/01/2018 à 17:57, AlainL a écrit :
Bonsoir,
Comment feriez-vous pour obtenir dans toute la liste les noms de famille
en gras, les noms de genre en "normal" et les noms d'espèces en italique
? Merci
alainL
_________________________________________________________________________
<ul>
<li/>Famille :
<ul>
<li>Genre : Espèce1, Espèce2</li>
<li>Genre : Espèce3, Espèce4</li>
</ul>
</li>
<li/>Amaryllidaceae :
<ul>
<li>Allium : Allium ericetorum, Allium ursinum</li>
<li>Narcissus : Narcissus bulbocodium, Narcissus pseudonarcissus</li>
</ul>
</li>
/ul>
__________________________________________________________________________

Il faut définir un style pour chaque élément. Par exemple :
<head>
<style>
li.famille {
font-weight: bold;
}
li.genre {
font-weight: normal;
}
</style>
</head>
<ul>
<li class="famille"> Famille :
<ul>
<li class="genre">Genre : <span style="font-style:italic">Espèce1,
Espèce2</span></li>
<li class="genre">Genre : <span style="font-style:italic">Espèce3,
Espèce4</span></li>
</ul>
</li>
<p>
<li class="famille">Amaryllidaceae :
<ul>
<li class="genre">Allium : <span style="font-style:italic">Allium
ericetorum, Allium ursinum</span></li>
<li class="genre">Narcissus : <span style="font-style:italic">Narcissus
bulbocodium, Narcissus pseudonarcissus</span></li>
</ul>
</li>
</ul>
Avatar
AlainL
Le 13/01/2018 à 12:15, Duzz' a écrit :
Le 11/01/2018 à 17:57, AlainL a écrit :
Bonsoir,
Comment feriez-vous pour obtenir dans toute la liste les noms de famille
en gras, les noms de genre en "normal" et les noms d'espèces en italique
? Merci
alainL
_________________________________________________________________________
<ul>
<li/>Famille :
<ul>
<li>Genre : Espèce1, Espèce2</li>
<li>Genre : Espèce3, Espèce4</li>
</ul>
</li>
<li/>Amaryllidaceae :
<ul>
<li>Allium : Allium ericetorum, Allium ursinum</li>
<li>Narcissus : Narcissus bulbocodium, Narcissus pseudonarcissus</li>
</ul>
</li>
/ul>
__________________________________________________________________________

Il faut définir un style pour chaque élément. Par exemple :
<head>
<style>
li.famille {
font-weight: bold;
}
li.genre {
font-weight: normal;
}
</style>
</head>
<ul>
<li class="famille"> Famille :
<ul>
<li class="genre">Genre : <span style="font-style:italic">Espèce1,
Espèce2</span></li>
<li class="genre">Genre : <span style="font-style:italic">Espèce3,
Espèce4</span></li>
</ul>
</li>
<p>
<li class="famille">Amaryllidaceae :
<ul>
<li class="genre">Allium : <span style="font-style:italic">Allium
ericetorum, Allium ursinum</span></li>
<li class="genre">Narcissus : <span style="font-style:italic">Narcissus
bulbocodium, Narcissus pseudonarcissus</span></li>
</ul>
</li>
</ul>

Merci. J'ai découvert la hierarchie des <li> ce qui permet d'éviter la
classe :
puis, comme mes noms d'espèces seront tous des liens, je définis la
police de ceux-ci avec a.link
Bon, maintenant j'ai au moins 500 lignes à faire...
Bonne soirée
alainL
_______________________________________________________________________
<style>
li {
font-weight: bold;
}
li li {
font-weight: normal;
}
a:link { font-style:italic; font-size:smaller ; color:red;
border-color:#fff; }
</style>
____________________________________________________________________
---
L'absence de virus dans ce courrier électronique a été vérifiée par le logiciel antivirus Avast.
https://www.avast.com/antivirus