Circle

A circle is positioned with the cx and cy attributes. These indicate the x and y coordinates of the center of the circle. The radius is determined by the r attribute. The following is an example you can experiment with ( http://localhost:8080/chapter-2/circle.html):

<circle cx="62" cy="62" r="50"></circle> 

Now type in the following code:

   circle { 
        stroke-width: 5; 
        stroke:steelblue; 
        fill:#888; 
        fill-opacity: .5; 
   } 

This will create a circle with the familiar blue outline, a gray interior, and half-way opaque.