Ajouter une autre réponse à cette question car j'avais besoin précisément de ce que @derek demandait et j'étais déjà allé un peu plus loin avant de voir les réponses ici. Plus précisément, j'avais besoin de CSS qui pourrait également expliquer le cas avec exactement deux éléments de liste, où la virgule n'est PAS souhaitée. À titre d'exemple, certaines signatures d'auteur que je souhaitais produire ressembleraient à ceci:
Un auteur:
By Adam Smith.
Deux auteurs:
By Adam Smith and Jane Doe.
Trois auteurs:
By Adam Smith, Jane Doe, and Frank Underwood.
Les solutions déjà données ici fonctionnent pour un auteur et pour 3 auteurs ou plus, mais ne prennent pas en compte le cas des deux auteurs - où le style "Oxford Comma" (également connu sous le nom de style "Harvard Comma" dans certaines parties) ne s'applique pas - c'est-à-dire qu'il ne doit pas y avoir de virgule avant la conjonction.
Après un après-midi de bricolage, j'avais proposé ce qui suit:
<html>
<head>
<style type="text/css">
.byline-list {
list-style: none;
padding: 0;
margin: 0;
}
.byline-list > li {
display: inline;
padding: 0;
margin: 0;
}
.byline-list > li::before {
content: ", ";
}
.byline-list > li:last-child::before {
content: ", and ";
}
.byline-list > li:first-child + li:last-child::before {
content: " and ";
}
.byline-list > li:first-child::before {
content: "By ";
}
.byline-list > li:last-child::after {
content: ".";
}
</style>
</head>
<body>
<ul class="byline-list">
<li>Adam Smith</li>
</ul>
<ul class="byline-list">
<li>Adam Smith</li><li>Jane Doe</li>
</ul>
<ul class="byline-list">
<li>Adam Smith</li><li>Jane Doe</li><li>Frank Underwood</li>
</ul>
</body>
</html>
Il affiche les bylines comme je les ai ci-dessus.
En fin de compte, j'ai également dû me débarrasser de tout espace entre les liéléments, afin de contourner une gêne: la propriété inline-block laisserait sinon un espace avant chaque virgule. Il y a probablement un hack alternatif décent pour cela, mais ce n'est pas le sujet de cette question, je vais donc laisser à quelqu'un d'autre le soin de répondre.
Fiddle ici: http://jsfiddle.net/5REP2/