• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Hour 14. Transforms > Transforming Using the rotate Property

Transforming Using the rotate Property

Rotation is possible by applying transform="rotate(A)" to your desired element. In this case, “A” refers to the angle of the rotation. A positive angle value will rotate an object in a clockwise direction, whereas a negative value defines a counterclockwise direction. The rotation will occur around the object's top-left corner (the (0,0) coordinates).

As you can imagine, the sun from previous examples might not be a good test case for rotation. Instead, you can rotate a simple object like a rectangle in the center of your document. As Listing 13.5 used such a shape, open that document, copy its code, and paste it into a new document. Next, add a transform attribute to the rect element (line 6 in Listing 14.5) and supply it with a rotate(15) value. This modification will produce a result similar to Figure 14.6, where the rectangle has been rotated 15° from and according to its top left corner.


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint