NO jQuery/javascript.

Back in July 2012 I produced a dartboard using around 80 lines of html and around 450 lines of CSS.
This was produced before it was considered necessary to use responsive styles so it had a fixed width.

I have decided that this needs updating to use the latest CSS styles and as such have found a method that can produce the majority of the dartboard using background linear, radial and conical gradients.

So this dartboard is now just one outer <div> for the framework and ten nested <div>s for the numbers and the final 'silver' ring holding the numbers.

The numbers are also responsive and remain the same size relative to the dartboard size, becoming responsive at 600px wide. The numbers will then reduce in size dynamically as the dartboard size reduces.

This works in all the latest browsers, BUT Firefox has a problem with radial-gradients where the rendering of the colors is a little jagged.
This bug has been around for 11 years, see Add dithering to gradient color transitions to address banding in 24-bit "truecolor"