bonsoir,
une petite idée pour <ol start> et <ol><li value>.
En selectionnant l'attribut et sa valeur avec un compteur initialisé a une valeur differente de 1 , on peut demarrer le comptage a peu prés ou l'on veut.
En testant des valeur negatives, opera, firefox et Ie8 semble être d'accord via css content et counter, c'est moins evident en se basant sur le simple attribut html.
test en ligne :
http://yidille.free.fr/plux/valign/uploads/ol-li-css-start-value.html
ou en copier/coller :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>test CSS. selecteur d'attribut[value]</title>
<style type="text/css" media="screen">
/* mise en forme puce , css content et initialisation du compteur */
ul {list-style-type:decimal;}
ol {
counter-reset: item;
list-style-type:none;
border:solid;
}
li {counter-increment:item;clear:left;}
ol li:before {content:counter(item)' -';
display:inline-block;
width:2em;
padding-right:0.5em;
text-align:right;
}
li[value] {font-weight:bold;background:lightblue;float:left;}
/* bidouille a mano pour value */
li[value="10"], ol[start="10"] {
color:red;
counter-reset: item 9;
counter-increment: item;
}
ol[start="-5"] {
color:purple;
counter-reset: item -6;
counter-increment: item ;
}
ol[start="-5"] li:before {content:counter(item)'°C';} /* pour justifier ce compteur [cligne] */
li[value="0"] {
color:green;
counter-reset: item -1;
counter-increment: item ;
}
</style>
</head>
<body>
<h1>test avec l'attribut start sur ol et value sur li dans des liste ordonnées et non-ordonnées</h1>
<h2>tests ol avec feuille de style comme correctif correctif</h2>
<ol>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li value="-200">item 4 (value="-200" sans style)</li>
<li>item 5</li>
<li>item 6</li>
<li value="10">item 7 (value="10")</li>
<li>item 8</li>
<li>item 9</li>
<li>item 10</li>
<li>item 11</li>
<li value="0">item 12 (value="0")</li>
<li>item 13</li>
<li>item 14</li>
</ol>
<ol>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li value="-200">item 4 (value="-200" sans style)</li>
<li>item 5</li>
<li>item 6</li>
</ol>
<ol>
<li value="10">item 1 (value="10")</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>
</ol>
<ol>
<li value="0">item 1 (value="0")</li>
<li>item 2</li>
<li>item 3</li>
</ol>
<ol start="10">
<li>item 1 (ol start="10")</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>
</ol>
<ol start="-5">
<li>item 1 (ol start="-5")</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>
</ol>
<h2> list ul sans style </h2>
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li value="-200">item 4 (value="-200")</li>
<li>item 5</li>
<li>item 6</li>
<li value="10" >item 7 (value="10")</li>
<li>item 8</li>
<li>item 9</li>
<li>item 10</li>
<li>item 11</li>
<li value="0">item 12 (value="0")</li>
<li>item 13</li>
<li>item 14</li>
</ul>
<ul start="-5">
<li>item 1 (ul start="-5")</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
<li>item 5</li>
</ul>
</body>
</html>