|
JOSE GERVIC LABE, JR.
|
How To: Webpage Creation #1066807 added March 23, 2024 at 11:52pm
Restrictions: None
HTML Elements
HTML ELEMENTS:
An HTML element is defined by a start tag, some content, and an end tag. It works similarly with Writing.Com's WritingML tag.
In WritingML, we write:
{writingmltag} Content goes here... {/writingmltag}
Example:
{size:5}First Heading{/size}
{size:3}My first paragraph.{/size}
In HTML, we write:
<tagname> Content goes here... </tagname>
Example:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
______________________________________________________
Start tag Element content End tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
< br > none none
______________________________________________________
IMPORTANT: Some HTML elements have no content (like the < br > and <hr> elements). These elements are called empty elements. Empty elements do not have an end tag.
Nested HTML Elements
HTML elements can be nested (this means that elements can contain other elements). All HTML documents consist of nested HTML elements. The following example contains four HTML elements (<html>, <body>, <h1> and <p>):
Example:
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
The <html> element is the root element and it defines the whole HTML document. It has a start tag <html> and an end tag </html>. Then, inside the <html> element there is a <body> element:
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
The <body> element defines the document's body. It has a start tag <body> and an end tag </body>. Then, inside the <body> element there are two other elements: <h1> and <p>:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
The <h1> element defines a heading. It has a start tag <h1> and an end tag </h1>:
<h1>My First Heading</h1>
The <p> element defines a paragraph. It has a start tag <p> and an end tag </p>:
<p>My first paragraph.</p>
IMPORTANT: Never skip the end tag. Some HTML elements will display correctly, even if you forget the end tag. However, never rely on this! Unexpected results and errors may occur if you forget the end tag. Notice the example below:
Example:
<html>
<body>
<p>This is a paragraph.
<p>This is a paragraph.
</body>
</html>
This works perfectly fine but again, do not rely on this. Always make sure to close your tags.
Empty HTML Elements
HTML elements with no content are called empty elements. Examples of this are the < br > and <hr> tags
The < br > tag defines a line break and is useful for writing addresses or poems. Whereas the <hr> tag defines a thematic break in an HTML page (e.g. a shift of topic). The <hr> element is most often displayed as a horizontal rule (line) that is used to separate content (or define a change) in an HTML page.
Example using < br > tag:
<p>This is a < br > paragraph with a line break.</p>
which yields:
This is a
paragraph with a line break.
Example using <hr> tag:
<p>This is the first paragraph.
<hr>
This is the second paragraph.
</p>
which yields:
This is the first paragraph.
_________________________
This is the second paragraph.
IMPORTANT: HTML tags are not case sensitive: <P> means the same as <p>. The HTML standard does not require lowercase tags, but it is always better to use lowercase in your tags.
Note that there must be no spaces in between <, br, and >. I especially added spaces here because somehow Writing.com recognizes this tag in this item. |
© Copyright 2024 GERVIC (UN: gervic at Writing.Com). All rights reserved.
GERVIC has granted InkSpot.Com, its affiliates and its syndicates non-exclusive rights to display this work. |
