Skip to main content

Introduction to HTML: HTML
Syntax

A bare bones introduction to HTML coding

Tags

HTML Tags

The most important characters in HTML are:

1 -- angle brackets (<    >), which enclose HTML codes, and

2 -- the forward slash (/), which is used to "close" HTML expressions

HTML tags enclose the elements or sections of the web page they're intended to affect. Tags are differentiated -- and hidden -- from the content of the web page by the presence of angle brackets, i.e., < >. If I wanted to bold the word HTML in code it would look like <b>HTML</b>, or <strong>HTML</strong>

Note that tags affecting a section of the text must be closed. This means adding a forward slash (/) before the tag is repeated at the end of the section, e.g., </p>

Attributes & Values

ATTRIBUTES

Attributes are added to simple HTML tags that change how that tag behaves. Most tags have default attributes, but attributes can alter those. For example, the tag that produces a horizontal rule, <hr />, produces a line that looks like this:


Its default is to be centered, extend across 100% of the available width, and be one pixel thick. But adding an attribute, such as "height," which affects thickness, or "width," in addition to a value, a numerical quantity or percentage, will change its appearance, e.g.,

<hr width="50%" align="right" /> produces this horizontal line:

 


 

VALUES

Specific values are placed in quotation marks following the attribute. A value can be a specific size, color, font face, etc. Attributes and values can be applied to tags such as <font>, <img> (e.g., image height and width), <p> and many others, for example:

<font color="red"> produces red text.

<font size="+2"> doubles the size of the default text.

HTML Syntax = Tags, Attributes, and Values

In summary, here's the syntax of a typical HTML expression:

<tag attribute="value">

Example:

<font size="+2" color="red">

font is the tag
size and color are attributes
"+2" and "red" are values.

And of course you must close the tag when you want those style characteristics to end, e.g.:

<font size="+2" color="red">This is big red text.</font>

Size values can be expressed as either relative (percentage, proportion) or absolute (a specific numerical value). In the example above, the "+2" means the font should appear at twice the size of the default.

Web Accessibility Assistance