Monday, July 23, 2018

HTML Key Components


HTML Key Components


HTML markup consists of several key components, including those called tags (and their attributes), character-based data types, character references and entity references. HTML tags most commonly come in pairs like <h1> and </h1>, although some represent empty elements and so are unpaired, for example <img>. The first tag in such a pair is the start tag, and the second is the end tag (they are also called opening tags and closing tags).

Another important component is the HTML document type declaration, which triggers standards mode rendering.

HTML Components (HTCs) are a legacy technology used to implement components in script as Dynamic HTML (DHTML) "behaviors" in the Microsoft Internet Explorer web browser. ... An HTC is typically an HTML file (with JScript / VBScript) and a set of elements that define the component.

The following is an example of the classic "Hello, World!" program:

<!DOCTYPE html>

<html>

  <head>
    <title>This is a title</title>
  </head>

  <body>
    <p>Hello world!</p>
  </body>

</html>

Output:



Document elements

Example Explained

  • The <html> element defines the whole document.


It has a start tag <html> and an end tag </html>.

  • The element content is another HTML element (the <body> element).
The <body> element defines the document body.


<html>

<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>

</html>

Output:



It has a start tag <body> and an end tag </body>.
The element content is two other HTML elements (<h1> and <p>).

<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>

Output:


  • The <h1> element defines a heading.


It has a start tag <h1> and an end tag </h1>.

The element content is: My First Heading.

<h1>My First Heading</h1>

Headings: HTML headings are defined with the <h1> to <h6> tags:

<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>

  • The <p> element defines a paragraph.


It has a start tag <p> and an end tag </p>.

The element content is: My first paragraph.

<p>My first paragraph.</p>

Do Not Forget the End Tag
Some HTML elements will display correctly, even if you forget the end tag:

Example

<html>
<body>

<p>This is a paragraph
<p>This is a paragraph

</body>

</html>

The example above works in all browsers, because the closing tag is considered optional.

Never rely on this. It might produce unexpected results and/or errors if you forget the end tag.

Empty HTML Elements
HTML elements with no content are called empty elements.

  • <br> is an empty element without a closing tag (the <br> tag defines a line break). 

Empty elements can be "closed" in the opening tag like this: <br />.

HTML5 does not require empty elements to be closed. But if you want stricter validation, or if you need to make your document readable by XML parsers, you must close all HTML elements properly.



0 Post a Comment:

Post a Comment