Attributes: Points

Learn the basics of the point attribute.

What is an attribute?

At the start of writing this section, I was faced with the question: “What’s an attribute?” But a reasonable answer has eluded me, so I will make the assumption that the answer will be something of a compromise. I like to think that an attribute of an element is something that is a characteristic of the object without defining it, and/or it may affect the object’s position or orientation on the page. There could be a strong argument to say that the following section on styles could be seen to crossover into attributes, and I agree. However, for the purposes of providing a description of the syntax and effects, I’m happy with the following list.

Because not all attributes are applicable to all elements, there will be a bit of variation in the type of shapes that we deal with in the description below. But there won’t be any that are different from those that we’ve already looked at. There will be some repetition with recurring information from the elements section. This is intentional to hopefully allow each section to exist in its own right.

x, y

The x and y attributes are used to designate a position on the web page that is set from the top left-hand corner of the web page. Using the x and y attributes places, the anchor points for these elements at a specified location. Of the elements that we have examined thus far, the rectangle element and the text element have anchor points to allow them to be positioned.

For example, the following is a code section required to draw a rectangle (using only the required attributes).

Get hands-on with 1200+ tech skills courses.