Elements - HTML Tutorial
After experimenting with our example webpage, it’s time to define elements more formally. An HTML element generally has three main components:
<name attribute1="value1" attribute2="value2" ... >
... content or other elements ...
</name>
-
<name>: Identifies the type of element, such asbodyorem. Element names are case-insensitive:<BODY>,<body>, and<bOdY>are all valid. Lowercase is the modern convention and easier to type. -
attribute: Modifies the behavior of an element. For instance, thestyleattribute lets you change the appearance of an element. -
value: Specifies the setting for an attribute. For example,background: yellowin astyleattribute changes the element’s background color.
Some elements do not require a closing tag. For example, br creates a line break and should not wrap any content. See “Paragraph Breaks” for more on line breaks.
Other elements may not require attributes. In Example 1.6, the body element included a style attribute, but it also works perfectly without one. By contrast, the a element requires an href attribute to define its link destination - otherwise, it won’t function as a link.
Misspellings and Unsupported Elements
When processing an HTML page, browsers generally:
- Recognize anything between angle brackets (
<>) as an element. - Check if they know how to handle that element:
- If yes, the browser applies the element’s instructions.
- If no, the browser ignores the element.
An element might be ignored because:
- It is misspelled or doesn’t exist (e.g.,
mxyzptlkis not an HTML element). - The browser doesn’t support it (e.g., the
blinkelement works in some browsers but not in most modern ones).
Warning: <blink>For external use only</blink>.
Avoid contact with eyes.Most modern browsers ignore the blink element because it is obsolete. Avoid using it in practice, as it is distracting and not standard.
Caution
The blink element is not part of the official HTML standard and should generally be avoided.
What’s a “Tag”?
You’ll often hear people say “HTML tags” when they really mean “elements.” A tag defines the start or end of an element:
- Incorrect: “Create a new HTML paragraph with a
<p>tag.” - Correct: “Start a new paragraph with an opening
<p>tag and close it with</p>.”
Tags are just the markers for elements. Attributes, like alt for images, are not tags either - they provide extra information about an element.
Understanding the difference between elements, tags, and attributes is key to writing correct and maintainable HTML. Confusing them is common, even among professionals, but keeping the terminology straight will make your coding much clearer.