Learn HTML
|HTML: Html Stands for Hyper Text Markup Language where markup language is a set of markup tags. We Know markup tags are described by HTML tags and each HTML tag describes different document content. Below a small HTML document example is given.
<!DOCTYPE html>
<html>
<head>
<title>unitedevelopers</title>
</head>
<body>
<h1>This is heading area</h1>
<p>This is paragraph area</p>
</body>
</html>
In the above example:
DOCTYPE: This declaration defines the document type to be HTML.
<html></html>: It describes and HTML document.
<head></head>: It provides the information about the document.
<title></title>: It provides title for the document.
<body></body>: It describes the visible content of the page.
<h1></h1>: It describes heading.
<p></p>: It describes the paragraph
HTML Tags: These are the Keywords (tag names) that surrounds by angle brackets.
Note:
HTML tags normally come in pairs like<p> and </p>
Where, start tag often called as opening tag and end tag as closing tag.
Only the code written between <body></body> are displayed by the browser.
What is <!DOCTYPE> Declaration?
In order to display document correctly, the browser must know both type and version and <!DYCTYPE> Declaration helps the browser to display a web page correctly. Remember the doctype declaration is not case sensitive. So all cases are acceptable.
For HTML verson 5 we simply type <!DOCTYPE html>
HTML Editors.
HTML can be coded or edited by using different professional HTML editor.
Adobe Dereamweaver
Microsoft Expression Web
Notepad++
Sublime text.
PHPStrom
However, for learning phase we are recommend you to code on a notepad(pc) or TextEdit(Mac). Because using simple text editor is a good way to learn.
How to use Notepad for cooding
- Open notepad: for that click on start, All Programs, Accessories and then click on Notepad
OR
- Click on start and then click on run and type notepad and press enter .
- Write some code on the notepad
- Click on file and save as giving extension name as .htm or .html.
- Now you can see the file have your browser icon.
- You can double click on that icon to open it
HTML BASIC
HTML Documents
Every documents must start with <!DOCTYPE html>
The HTML documents begins with <html> tags and ends with </html>
The visible part of whole document will be in between <body> and </body> tag
HTML Heading
HTML have different heading from <h1> to <h6> the size of text increases from <h6> to <h1> . So biggest heading is <h1> and smallest is <h6>
HTML Paragraph
HTML paragraph tag are defined as <p> tag
HTML Link
<HTML Llinks are defined with the <a> tag
Eg. <a href=”http://www.unitedevelopers.com “> this is a link </a>
In the above example href is the attribute that provides the additional information about the HTML elements.
HTML Images
HTML images are defined with the <img> tag.
Example: Img src=”unitedeveloper.jpg” alt=”unitedevelopers.com” width=”100” height=”100”>
On the above example we can see many attributes like src, alt size(width and height) where src represents source file, alt represents the alternative text and width and height represents the size or the file.
HTML Elements
HTML documents are made up by elements. They are written with start tag, with an end tag with the content in between. HTML element is everything from the start tag to end tag.
Nested HTML elements..
HTML elements may have other elements are called as nested. So we can say that all the HTML elements have nested HTML elements.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
On the above example,
<html> elements represent the whole document. It has 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 and It has a start tag <body> and the end tag <body> which defines the document body.
The element content has other two HTML elements(<h1> and <p>) where <h1> elements defines a heading and <p> defines the paragraph. Both has start tag and end tag.
Note:
Every tag must have end tag.
Empty HTML elements.
HTML elements which has no content are often called as empty elements.
For example <br> which has no closing tag. So we can close the empty tag at the opening tag like this <br />
TIPS
Html tags are not case sensitive. We can use any letters for the HTML tags HTML 5 standard does not require lowercase but w3c recommends lowercase and for stricter document types like XHTML it demands lowercase.