HTML/CSS Vocabulary and Syntax

Here is a summary of the most important vocabulary terms that pertain to the structure and appearance of web pages. The following code snippet illustrates each of the terms:

Click or tap on any of the boldface terms below to highlight the corresponding portion of the example:

• HTML: Hyper-Text Markup Language, the language used to define the logical structure of web pages, breaking them down into various elements using tags.
• Element: A logical unit of an HTML document, such as a header, a paragraph, or a link. Every element begins with an opening tag; most also include content and a closing tag. (The code snippet above consists of a single element.)
• Opening tag: A unit of HTML code, enclosed in angle brackets, that marks the beginning of an element. Examples include <h2>, <p>, and <a>. Some opening tags, such as <img> and <br>, are self-contained elements that have no content or closing tag.
• Closing tag: A unit of HTML code that marks the end of an element, such as </h2>, </p>, and </a>. Each closing tag is the same as the corresponding opening tag, except for an additional slash after the first angle bracket and the omission of any attributes.
• Content: Everything between the opening and closing tags of an HTML element. The content can consist of text and/or nested HTML elements.
• Attribute: A property or characteristic of an HTML element, such as id or src or style or onclick, that is specified inside its opening tag using the syntax attributename="value". Attribute values should be enclosed in quotes (though browsers don't always enforce this rule), and multiple attribute assignments are separated by spaces. The order in which multiple attributes are specified doesn't matter.
• CSS: Cascading Style Sheets, the language used to specify the appearance (e.g., fonts, colors, borders, and placement) of HTML elements. CSS code can be placed in an external .css file or inside the special HTML <style> element, but for simple web pages it is easiest to assign it using the style attribute.
• Property: Any characteristic of the appearance or placement of an HTML element that can be specified using CSS, such as color or font-family or margin. The syntax for specifying a property is property-name:value; (note the colon before the value, the semicolon after it, and the absence of quotes). The order in which multiple properties are specified doesn't matter.

So in the code snippet above, there are two CSS properties that are specified in the style attribute, which is one of two attributes specified in the opening tag of the h2 HTML element. Got it? :)