Skip to content

Courses / HTML5 Mastery: Complete Beginner to Advanced Course / Elements, Tags, Attributes

589 people viewed this

Elements, Tags, Attributes

  • href specifies the destination of the link.
  • target="_blank" requests that the destination open in a new browsing context, usually a new tab.
  • rel="noopener" prevents the newly opened page from accessing the originating page through window.opener.

The text Visit Codementrix is the link's content, not an attribute.

Attribute Syntax

The usual form is:

<element-name attribute-name="attribute value">Content</element-name>

For example:

<img src="logo.png" alt="Codementrix logo" width="200">

Here, src, alt, and width are attributes. Their values identify the image file, describe the image for users who cannot see it, and specify its displayed width in CSS pixels.

Multiple Attributes

An element can have multiple attributes. Separate attributes with whitespace, usually spaces or line breaks.

<input
  type="email"
  id="work-email"
  name="email"
  placeholder="you@example.com"
  required
>

This input is configured as an email field with an identifier, a form-submission name, placeholder text, and a required constraint.

Attribute order usually does not affect meaning. The following examples are equivalent in their essential behavior:

<input type="text" name="username" id="username">

<input id="username" name="username" type="text">

6. Quoted and Unquoted Attribute Values

HTML allows attribute values to be written with double quotes, single quotes, or without quotes in limited cases. For reliable, readable code, use quotes consistently.

Double Quotes (Recommended)

<a href="https://example.com">Example</a>

Single Quotes

<a href='https://example.com'>Example</a>

Unquoted Values

<input type=text>

An unquoted value is valid only when it is non-empty and contains no ASCII whitespace or any of the characters that make an unquoted value invalid, including quotation marks, apostrophes, equals signs, less-than signs, greater-than signs, and grave accents.

Rate this course

5.0 · 1 rating

Stars show on this course. Your written note stays private.

Your stars