O'Reilly logo

Designing SVG Web Graphics by Andrew H. Watt

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

The <rect> Element

The SVG <rect> element, when rendered, causes a rectangle to be painted on the SVG canvas. When you drag out a rectangle using Jasc WebDraw or your favorite SVG-enabled vector drawing tool, you produce a simple SVG document that looks something like this:

Listing 3.1. (03WebDraw.svg)
 <?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/PR-SVG-20010719/ DTD/svg10.dtd"> <svg width="500" height="500"> <rect x="192" y="93" width="142" height="78" rx="0" ry="0" style="stroke-miterlimit:4; stroke-linejoin:miter; stroke-width:3; stroke-opacity:1; stroke:rgb(0,204,255); fill-opacity:1;fill:rgb(204,204,204); opacity:1"/> </svg> <!-- Generated by Jasc WebDraw PR4(tm) on 04/03/01 ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required