HTML Skeleton, Elements and CheatSheet
Introduction to HTML :
HTML stands for Hyper Text Markup Language. It is a web page describing language developed by W3 Consortium (founder of W3 Consortium “Tim Berners Lee” in 1989). We learn about HTML Skeleton, Elements and CheatSheet.
File Extension: .html or .htm
Importance of HTML in Webpage Designing
Advantages of HTML
- It is Free
- HTML is Easy to Learn and Use
- HTML is Basic of all Programming Languages
- HTML is User-Friendly
- HTML is supported by all Browsers
- HTML is Simple to Edit
- HTML can integrate easily with Other Languages
- HTML is very Lightweight
- Display Changes Instantly
Disadvantages of HTML
- It can create only static and plain pages so we can not create dynamic pages using HTML.
- Need to write a lot of code for making a simple webpage.
- Security features are not available in HTML.
- If we need to write long code for making a webpage then it produces some complexity.
- Domain name like: hitech.edu.np, www.yamsoti.com, www.google.com
- Hosting package (storage space)
- FTP Server: File zilla, Cute, winscp FTP etc.
- PC with internet connection
Skeleton of HTML
<!DOCTYPE html> <html> <head> <title>This is my first page</title> </head> <body> <h1>Welcome to HTML</h1> <p>Hi I am learning HTML.</p> </body> </html>
HTML tags are element names surrounded by angle brackets:<>
There two types of html tag :
Paired tag (container tag):
- Opening tag <html>
- Closing tag </html>
Unpaired tag (empty tag)
- <frame src>
What is the difference between container tag and empty tag?
HTML attributes are values added to the opening tag of an element to configure the element or change the element’s default behavior. Like: <p align=”justify”> or <p style=”text-align:justify;”>
HTML comments are not displayed in the browser, but they can help document your HTML source code.
<!– Write your comments here –>
HTML Tag vs. Element
An HTML element is defined by a starting tag. If the element contains other content, it ends with a closing tag.
For example, <p> is starting tag of a paragraph and </p> is closing tag of the same paragraph but <p>This is my paragraph</p> is a paragraph element.
Nested HTML Elements
It is very much allowed to keep one HTML element inside another HTML element
<!DOCTYPE html> <html> <head> <title>Nested Elements Example</title> </head> <body> <h1>This is <u>under line style inside heading</u> heading</h1> <p>This is <i>italic style inside paragraph element</i> paragraph</p> </body> </html>