Tutorial
#2:
HTML Editors and HTML Basic Examples
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.
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
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>
<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>
<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>
<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">
