Log In


Tuesday, March 1, 2011

Introduction to HTML

Today I will show you what is HTML and what can you do with HTML. Also, I will introduce HTML to you so let's get started!

What is HTML?
First of all, HTML stands for Hyper Text Markup Language. Some people thinks that HTML is a programming language but its not. HTML is markup language. A mark up language is a set of markup tags. With HTML, you can create websites.

Introduction:
Well, HTML is really easy to learn so lets start with the code. The first thing that I would recommend is to have a notepad. If you don't have one then you can download it from Google. Let's get started!

  • Open NotePad
  • Remember: When ever you are writing HTML code, it has to look like this so when you save it as "htm", it will show up in IE, Firefox, and Chrome. 
Here is an Example:

<html>
<body>
 
<title>Exmaple</title>

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

</body>
</html>

  • When ever starting, you have to include <html> at the very top and </html> at the end so the computer knows that you are writing the html language otherwise it will not work!
  •  You need to include the <body> and </body> because the body is where you have to write everything so if you don't include them then the computer will think that all this code belongs no where and you won't see the code when you open through IE.
  • You also need <title> and </title>. This title is what you would see on the tab when you open it up with Internet Explorer.
  •  <h1> and </h1> stands for Heading # 1 so its the biggest heading you can have.
  • <p> and </p> stands for paragraph so when ever staring a new paragraph, use <p> and </p>.
  • And then at the end Enclose them with </body> and </html> so the computer knows that the body and the html code is finished! 

Here is some additional code if you want to add. For the first time, you will have some trouble with adding the new code but if you don't make mistakes then you won't learn so have fun with it:

Additional Code:

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


<p>This is paragraph #1.</p>
<p>This is paragraph #2.</p>


<a href="http://www.google.com">Google</a> - So in this case, when you type that and save the file and open it, you will only see "Google" but when you click on it, it will take you to Google.com because I have redirected the text with Google.

<img src="http://28.media.tumblr.com/RbC2kQA2Cmnn1jquCcFw3ESZo1_400.jpg" width="104" height="142" /> - So this is the code for inserting an image; first you put the link of the image and the you decide how wide and long you want the picture to be by playing with width and height.

If you have any questions or would like to know other things then please leave a comment!

0 comments:

:a :a   :b :b   :c :c   :d :d   :e :e   :f :f   :g :g   :h :h   :i :i   :j :j   :k :k   :l :l   :m :m   :n :n   :o :o   :p :p   :q :q   :r :r   :s :s   :a :t

Post a Comment

After, you have commented, feel free to sign up for our Newsletter or become a member by registering with us! Thanks for your Comment!

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More