Sunday, 11 September 2016

HTML Editors and HTML Basic Examples


Tutorial #2:
HTML Editors and HTML Basic Examples
Hi Friends Today we will learn about HTML editors and HTML Basic Examples J
Todays Topics are:

1.                  HTML Documents

2.                  HTML Headings

3.                  HTML Paragraphs

4.                  HTML Links

5.                  HTML Images


HTML Editors:

Write HTML Using Notepad or TextEdit

Web pages can be created and modified by using professional HTML editors.
However, for learning HTML we recommend a simple text editor like Notepad (PC) or TextEdit (Mac).
We believe using a simple text editor is a good way to learn HTML.
Follow the four steps below to create your first web page with Notepad or TextEdit.

Step 1: Open Notepad (PC)

Open Notepad in Windows 8 or later:
Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad.Open Notepad in Windows 7 or earlier:
Click Start (bottom left on your screen). Click All Programs. Click Accessories. Click Notepad.

Step 1: Open TextEdit (Mac)

Open TextEdit.
Please be sure that the text editor is set to plain text. Go to: Preferences > New Document > select plain text.
Also make sure both "Display html file as html code" and "Display RTF file as RTF code" options are checked under "Open and Save".
Then open a new document to place the code.

I will recomend you to Use Sublime Text Editor
HTML Basic Examples
Don't worry if these examples use tags you have not learned.
You will learn about them in the next Tutorials. J

HTML Documents

All HTML documents must start with a document type declaration: <!DOCTYPE html>.
The HTML document itself begins with <html> and ends with </html>.
The visible part of the HTML document is between <body> and </body>.

Example

<!DOCTYPE html>
<html>
<body>

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

</body>
</html>

HTML Headings

HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading: 

Example

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>

HTML Paragraphs

HTML paragraphs are defined with the <p> tag:

Example

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

HTML Links

HTML links are defined with the <a> tag:

Example

<a href="http://www.w3schools.com">This is a link</a>

HTML Images

HTML images are defined with the <img> tag.
The source file (src), alternative text (alt), and size (width and height) are provided as attributes:

Example

<img src="w3schools.jpg" alt="W3Schools.com" width="104"height="142">
  

Ijaz Ur Rahim

Author & Editor

This Website Has been Designed by IJAZ UR RAHIM

0 comments:

Post a Comment