11.19.10
CSS3 Charts example
CSS3 has really brought something new, Although not all browsers are supported, however, require the use and purpose, with the browser is supported, it was great Great, like the example below, CSS3 Charts
Using some of the CSS3 properties: CSS3 gradient, CSS3 box-reflect, CSS3 transition, CSS3 border-radius, radial-gradient CSS3, CSS3 box-shadow, nth-child CSS3 …
Source code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title>CSS3 Charts-GLOBAL usage share of web browsers</title> <link href="css/stylesheet.css" rel="stylesheet" TYPE="text/css" /> </head> <body> <div ID="pie_chart"> <ul> <li ID="c1_r"><p><span class="pie_left"></span></p></li> <li ID="c1_l"><p><span class="pie_right"></span></p></li> <li ID="c2_r"><p><span class="pie_left"></span></p></li> <li ID="c2_l"><p><span class="pie_right"></span></p></li> <li ID="c3_r"><p><span class="pie_left"></span></p></li> <li ID="c3_l"><p><span class="pie_right"></span></p></li> <li ID="c4_r"><p><span class="pie_left"></span></p></li> <li ID="c4_l"><p><span class="pie_right"></span></p></li> <li ID="c5_r"><p><span class="pie_left"></span></p></li> <li ID="c5_l"><p><span class="pie_right"></span></p></li> </ul> </div> </body> </html> |
View : stylesheet.css