O'Reilly logo

Special Edition Using XML, Second Edition by - et al. David Gulbransen

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

SVG Basic Shapes

SVG provides a number of basic graphic shapes. In earlier examples, you have seen some of these in use—but without any explanation. In this section, each of the basic SVG graphics shapes is introduced.

The <rect> Element

The SVG <rect> element, not surprisingly, creates a rectangular shape. A rectangle has a width and a height, which are described by the width and height attributes on the <rect> element. The rectangle also must have a defined position on the screen: Otherwise, the SVG rendering engine has no way of knowing where on the screen the rectangle should be displayed. The position of a rectangle is defined by the x and y attributes. With those four attributes defined, the SVG rendering engine can display a basic rectangle. ...

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