HTML5 ELEMENTS CHAPTER 4


FOURTH TUTORIAL IS HTML ELEMENTS

HTML Elements

An HTML element usually consists of a start tag and an end tag, with the content inserted in between:
<tagname>Content goes here...</tagname>
The HTML element is everything from the start tag to the end tag:
<p>My first paragraph.</p>

Start tag         Element content         End tag

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

HTML elements with no content are called empty elements. Empty elements do not have an end tag, such as the <br> element (which indicates a line break).

Nested HTML Elements

HTML elements can be nested (elements can contain elements).
All HTML documents consist of nested HTML elements.
This example contains four HTML elements:

  

Example

 

<!DOCTYPE html>

<html>

<body>

 

<h1>My First Heading</h1>

<p>My first paragraph.</p>

 

</body>

</html>


Example Explained



The <html> element defines the whole document.
Inside the <html> element is the <body> element.

The <body> element defines the document body.
Inside the <body> element is two other HTML elements: <h1> and <p>.

The <h1> element defines a heading.
The element content is: My First Heading.

The <p> element defines a paragraph.
The element content is: My first paragraph.


Empty HTML Elements


HTML elements with no content are called empty elements.

<!DOCTYPE html>
<html>
<body>

<p>This is a <br> paragraph with a line break.</p>

</body>
</html>

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



HTML Is Not Case Sensitive




HTML tags are not case sensitive: <P> means the same as <p>.

                                                             

created by: unknown programmer


Popular posts from this blog

HTML5 COMMENTS & CSS CHAPTER 8

Image
EIGHTH TUTORIAL ON HTML COMMENTS & CSS HTML comments are not displayed in the browser, but they can help document your HTML source code. HTML Comment Tags You can add comments to your HTML source by using the following syntax: <!-- Write your comments here --> With comments you can place notifications and reminders in your HTML: <!DOCTYPE html> <html> <body> <!-- This is a comment --> <p>This is a paragraph.</p> <!-- Comments are not displayed in the browser --> </body> </html> OUTPUT This is a paragraph. Comments are also great for debugging HTML, because you can comment out HTML lines of code, one at a time, to search for errors: <!DOCTYPE html> <html> <body> <!-- Do not display this at the moment <img border="0" src="pic_trulli.jpg" alt="Trulli"> --> </body> HTML  Styles – CSS ...
Read more

HTML FORMS INPUT TYPES CHAPTER 25 PART THREE

Image
25 th TUTORIAL ON HTML FORMS INPUT TYPES PART THREE HTML Input Types This chapter describes the different types for the HTML  <input>  element.   HTML Input Types Here are the different input types you can use in HTML: <input type="button"> <input type="checkbox"> <input type="color"> <input type="date"> <input type="datetime-local"> <input type="email"> <input type="file"> <input type="hidden"> <input type="image"> <input type="month"> <input type="number"> <input type="password"> <input type="radio"> <input type="range"> <input type="reset"> <input type="search"> <input type="submit"> <input type="tel"> <input type="text">...
Read more