Tags vs Elements vs Attributes in HTML
HTML Tags: Tags are the starting and ending parts of an HTML element. They begin with < symbol and end with > symbol. Whatever written inside < and > are called tags.
HTML elements: Elements enclose the contents in between the tags. They consist of some kind of structure or expression. It generally consists of a start tag, content and an end tag.
This is the content.
Where, <b> is the starting tag and </b> is the ending tag.
HTML Attributes: It is used to define the character of an HTML element. It always placed in the opening tag of an element. It generally provides additional styling (attribute) to the element.
This is paragraph.
|HTML Tags||HTML Elements||HTML Attributes|
|HTML tags are used to hold the HTML element.||HTML element holds the content.||HTML attributes are used to describe the characteristic of an HTML element in detail.|
|HTML tag starts with < and ends with >||Whatever written within a HTML tag are HTML elements.||HTML attributes are found only in the starting tag.|
|HTML tags are almost like keywords where every single tag has unique meaning.||HTML elements specifies the general content.||HTML attributes specify various additional properties to the existing HTML element.|
What are Tags and Attributes?
Tags and attributes are the basis of HTML.
They work together but perform different functions – it is worth investing 2 minutes in differentiating the two.
What Are HTML Tags?
Tags are used to mark up the start of an HTML element and they are usually enclosed in angle brackets. An example of a tag is: <h1>.
Most tags must be opened <h1> and closed </h1> in order to function.
What are HTML Attributes?
Attributes contain additional pieces of information. Attributes take the form of an opening tag and additional info is placed inside.
- An example of an attribute is:
<img src="mydog.jpg" alt="A photo of my dog.">
In this instance, the image source (src) and the alt text (alt) are attributes of the <img> tag.
Golden Rules To Remember
- The vast majority of tags must be opened (<tag>) and closed (</tag>) with the element information such as a title or text resting between the tags.
- When using multiple tags, the tags must be closed in the order in which they were opened. For example:
Example: <strong><em>This is really important!</em></strong>