CSS3 Counter for Figures

CSS3-Figure-Counter.css

article { 
  counter-reset: figure;
}
article figure { 
  counter-increment: figure;
}
article figure > figcaption:before {
  content: "Fig. " counter(figure) ": ";
}
html[lang=de] article figure > figcaption:before {
  content: "Abb. " counter(figure, upper-alpha) ": ";
}
/*
armenian  The marker is traditional Armenian numbering	
circle	The marker is a circle	
cjk-ideographic	The marker is plain ideographic numbers	
decimal	The marker is a number. This is default for <ol>	
decimal-leading-zero	The marker is a number with leading zeros (01, 02, 03, etc.)	
disc	The marker is a filled circle. This is default for <ul>	
georgian	The marker is traditional Georgian numbering	
hebrew	The marker is traditional Hebrew numbering	
hiragana	The marker is traditional Hiragana numbering	
hiragana-iroha	The marker is traditional Hiragana iroha numbering	
inherit	The value of the listStyleType property is inherited from parent element	
katakana	The marker is traditional Katakana numbering	
katakana-iroha	The marker is traditional Katakana iroha numbering	
lower-alpha	The marker is lower-alpha (a, b, c, d, e, etc.)	
lower-greek	The marker is lower-greek	
lower-latin	The marker is lower-latin (a, b, c, d, e, etc.)	
lower-roman	The marker is lower-roman (i, ii, iii, iv, v, etc.)	
none	No marker is shown	
square	The marker is a square	
upper-alpha	The marker is upper-alpha (A, B, C, D, E, etc.) 	
upper-latin	The marker is upper-latin (A, B, C, D, E, etc.)	
upper-roman	The marker is upper-roman (I, II, III, IV, V, etc.)
*/