Zysen
=)
Hello.
My name is Zysen.I gonna explain you HTML.It's really easy to learn!
Introduction:
Something that really is important is that if you really want to learn HTML then you should use Notepad++(recommended by many). And that because when you use for example Dreamweaver you just draw your website and write your text and then its done. But you don't learn anything. So i strongly recommend that you use Notepad for making pages that isn't that advanced.
Lets install Notepad++ if you don't got it!
Here's the installation site.Download it and install it.
http://notepad-plus-plus.org/release/5.8.4
Now lets start!
First you need to know how to make a .html file.
Follow the steps:
1.Open Notepad
2.Go on "Save as" and then do like this:
-Write the name of your file and put .html on the end like this:
I named it tutorial.html
It looks like this:
I am google chrome user so the icon looks like this.The icon could be also Opera,Safari,Mozilla,Internet Explorer icon,etc...
Now open your .html file in notepad that we just saved.
Put some basic tags in there:
So, some useful words:
a tag starts always with a "<" as you see. And it ends with a ">". The most tags have a starting tag and a ending tag (not all of them). A starting tag is like this:<TAG> and a ending tag is like this:</TAG>, So you have to put a slash after the "<" to close a tag.
As you see the code starts with a starting html tag and ends with a ending html tag. You can't put anything outside the html starting and ending tag.
Now some serious talk.
Inside the head tags,you put things like title and such.And inside the title tags you put title.Like you see title of this thread in your browser,up.
Now input your title inside the title tags like this:
Now we go to the body part:
In the body part you can write everything that will appear on the main part of the site and nowhere else.
Some useful tags:
(these things must be inputed inside the body tags)
the font tags is the easiest tags:
-"b" stands for bold and looks like this.
so if you want to make your text bold then you have to write like this:
-"i" stands for italic and looks like this.
If you want to write text in italic you have to write like this:
-"u" stands for underline and will make your text look like this
and the tags looks like the others:
-If you want to change the text size do it like this:
Options of text sizes:
*h1-biggest - HEADER SIZING TAG
*h2-smaller then biggest
*h3-standard
*h4-smaller then standard
*h5-tiny
*h6- smallest - HEADER SIZING TAG
Changing text color:
If you want to change the text color for the whole page write this in body tag:
instead of just
You can also find color codes here.
if you want to change the color just of one sentence or a word you need to write like this:
IMPORTANT!
And of course you can insert more then one tag to make your text look like you want it to, but then you must enter them like this:
Don't never do like this:
That will confuse your browser and it will look crazy.
Do like this
Never do like this
Attaching
When you attach you must have the attached file in the directory that you have your html file. And then you just link to it. You can learn how to link to it on the next step.
Linking
You can link everything that you can see in your webpage, you can make a picture to take you to google from your homepage when you click on it, same with pictures and text(and more things).
To link you gotta do like this:
-The red text is the tag.
-The green text is the attribute, it tells the browser how to operate a tag.
-The blue text is the destination of the link.
-The indigo text is the think that will appear on the webpage that will take people to the destination when they click on it.
You can also attach pictures:
-The red text is the formate of the picture, you can see it while right-clicking on the pictures and then clicking on "properties" and it will stay like ".JPEG" then you copy it and write it into your attachment.
-The blue text is the name of the image file (must be in same folder as your html file). write the name of the picture that you want to attach and write the right formate otherwise it won't work.
- The Brown text is the description of the picture, so if someone roll his/her mouse over it the description will appear.
-The Cyan text is the border, the options is 0/1. If you write 0 then the ugly blue or purple border of the picture will not appear, if you write 1 then they will
Download Item
If you want to attach something that people can download then you simply link to it, it should look like this:
-The green is the name of the file that you want to attach, you must put the exactly name of the file and the file must exist in the folder that your html is in.
-The red text is the formate of the file, can be anything. As i said: you can look the formate of the file by right-clicking on the file and then clicking on properties.
-The blue text is what will appear on the webpage, it can be anything like pictures and such.
If you want to link a picture so that when people clicks on the picture they download a file or such, but then they have to right-click on the picture/text/video or anything and then click "save file as". Otherwise it won't work.
You do it like this:
-The blue text is the file that people will download if they right-click and then click "save file as", it can be anything.
-The red text is what will appear on the webpage. so it maybe appears a picture and when you right-click and then click save file as then you will download a movie(.avi). The file must exist in the folder where the html file exists.
Changing background color/music
So if you want to change the color of the background then you have to write like this:
-The red text is the attribute of the tag, as i said: it tells the browser how to operate a tag. In this case it tells the browser to show a colored background.
And if you want to make a sound to be played on your webpage as background music then you simply make a tag like this:
Useful tags
-<br> - jumps down to the next line, works like a "enter" on your keyboard.
- - works like a "space" on your keyboard, useful since browsers doesn't make more then one space a time.
-<--YOURCOMMAND--> - make a command that doesn't do anything to your code, just appears on your html file.
-<pre> - shows your text exactly as you have written it in your html file.
-<center> makes everything that you write/attach after the tag appear in the middle of the website.
-<right> - same as above but now to the right.
I hope you learned something ^_^
Yours,
Zysen
My name is Zysen.I gonna explain you HTML.It's really easy to learn!
Introduction:
Something that really is important is that if you really want to learn HTML then you should use Notepad++(recommended by many). And that because when you use for example Dreamweaver you just draw your website and write your text and then its done. But you don't learn anything. So i strongly recommend that you use Notepad for making pages that isn't that advanced.
Lets install Notepad++ if you don't got it!
Here's the installation site.Download it and install it.
http://notepad-plus-plus.org/release/5.8.4
Now lets start!
First you need to know how to make a .html file.
Follow the steps:
1.Open Notepad
2.Go on "Save as" and then do like this:
-Write the name of your file and put .html on the end like this:
I named it tutorial.html
It looks like this:
I am google chrome user so the icon looks like this.The icon could be also Opera,Safari,Mozilla,Internet Explorer icon,etc...
Now open your .html file in notepad that we just saved.
Put some basic tags in there:
HTML:
<html>
<head><title></title></head>
<body>
</body>
</html>So, some useful words:
a tag starts always with a "<" as you see. And it ends with a ">". The most tags have a starting tag and a ending tag (not all of them). A starting tag is like this:<TAG> and a ending tag is like this:</TAG>, So you have to put a slash after the "<" to close a tag.
As you see the code starts with a starting html tag and ends with a ending html tag. You can't put anything outside the html starting and ending tag.
Now some serious talk.
Inside the head tags,you put things like title and such.And inside the title tags you put title.Like you see title of this thread in your browser,up.
Now input your title inside the title tags like this:
HTML:
<head><title>MY TITLE</title></head>Now we go to the body part:
In the body part you can write everything that will appear on the main part of the site and nowhere else.
Some useful tags:
(these things must be inputed inside the body tags)
the font tags is the easiest tags:
-"b" stands for bold and looks like this.
so if you want to make your text bold then you have to write like this:
HTML:
<b>Hello!</b>-"i" stands for italic and looks like this.
If you want to write text in italic you have to write like this:
HTML:
<i>Hello!</i>-"u" stands for underline and will make your text look like this
and the tags looks like the others:
HTML:
<u>Hello!</u>-If you want to change the text size do it like this:
HTML:
<h1>Hello!</h1>Options of text sizes:
*h1-biggest - HEADER SIZING TAG
*h2-smaller then biggest
*h3-standard
*h4-smaller then standard
*h5-tiny
*h6- smallest - HEADER SIZING TAG
Changing text color:
If you want to change the text color for the whole page write this in body tag:
HTML:
<body text="#COLOR CODE">instead of just
HTML:
<body>You can also find color codes here.
if you want to change the color just of one sentence or a word you need to write like this:
HTML:
<font color="#YOUR COLOR">YOUR TEXT</font>IMPORTANT!
And of course you can insert more then one tag to make your text look like you want it to, but then you must enter them like this:
HTML:
<h4><b>TEXT</b></h4>Don't never do like this:
HTML:
<h4><b>TEXT</h4></b>That will confuse your browser and it will look crazy.
Do like this
Never do like this
Attaching
When you attach you must have the attached file in the directory that you have your html file. And then you just link to it. You can learn how to link to it on the next step.
Linking
You can link everything that you can see in your webpage, you can make a picture to take you to google from your homepage when you click on it, same with pictures and text(and more things).
To link you gotta do like this:
HTML:
<[COLOR="Red"]a[/COLOR] [COLOR="SeaGreen"]href[/COLOR]="[COLOR="Blue"]www.google.com[/COLOR]">[COLOR="Indigo"]visit google[/COLOR]</a>-The red text is the tag.
-The green text is the attribute, it tells the browser how to operate a tag.
-The blue text is the destination of the link.
-The indigo text is the think that will appear on the webpage that will take people to the destination when they click on it.
You can also attach pictures:
HTML:
<img src="[COLOR="Blue"]IMAGENAME[/COLOR].[COLOR="Red"]JPG[/COLOR]" alt="[COLOR="DarkRed"]DESCRIPTION[/COLOR]" [COLOR="Cyan"]border="0"[/COLOR]>-The red text is the formate of the picture, you can see it while right-clicking on the pictures and then clicking on "properties" and it will stay like ".JPEG" then you copy it and write it into your attachment.
-The blue text is the name of the image file (must be in same folder as your html file). write the name of the picture that you want to attach and write the right formate otherwise it won't work.
- The Brown text is the description of the picture, so if someone roll his/her mouse over it the description will appear.
-The Cyan text is the border, the options is 0/1. If you write 0 then the ugly blue or purple border of the picture will not appear, if you write 1 then they will
Download Item
If you want to attach something that people can download then you simply link to it, it should look like this:
HTML:
<a href="[COLOR="darkgreen"]FILENAME[/COLOR].[COLOR="Red"]mp3[/COLOR]>[COLOR="Blue"]Download[/COLOR]</a>-The green is the name of the file that you want to attach, you must put the exactly name of the file and the file must exist in the folder that your html is in.
-The red text is the formate of the file, can be anything. As i said: you can look the formate of the file by right-clicking on the file and then clicking on properties.
-The blue text is what will appear on the webpage, it can be anything like pictures and such.
If you want to link a picture so that when people clicks on the picture they download a file or such, but then they have to right-click on the picture/text/video or anything and then click "save file as". Otherwise it won't work.
You do it like this:
HTML:
<a href="[COLOR="blue"]FILENAME.avi[/COLOR]">[COLOR="Red"]<img src="FILENAME.jpg">[/COLOR]</a>-The blue text is the file that people will download if they right-click and then click "save file as", it can be anything.
-The red text is what will appear on the webpage. so it maybe appears a picture and when you right-click and then click save file as then you will download a movie(.avi). The file must exist in the folder where the html file exists.
Changing background color/music
So if you want to change the color of the background then you have to write like this:
HTML:
<body [COLOR="red"]bgcolor="#YOURCOLOR"[/COLOR]></body>-The red text is the attribute of the tag, as i said: it tells the browser how to operate a tag. In this case it tells the browser to show a colored background.
And if you want to make a sound to be played on your webpage as background music then you simply make a tag like this:
HTML:
<bgsound src="FILENAME.mp3"/>Useful tags
-<br> - jumps down to the next line, works like a "enter" on your keyboard.
- - works like a "space" on your keyboard, useful since browsers doesn't make more then one space a time.
-<--YOURCOMMAND--> - make a command that doesn't do anything to your code, just appears on your html file.
-<pre> - shows your text exactly as you have written it in your html file.
-<center> makes everything that you write/attach after the tag appear in the middle of the website.
-<right> - same as above but now to the right.
I hope you learned something ^_^
Yours,
Zysen
Last edited:
