Your first script
Now is the time to write your very first script. I will explain all the tags later on in this tutorial. First of all open your favorite text editor and write the following code and save this file as a ".html" or a ".htm" file.
| <html> <head> <title>Your first Script</title> </head> <body> This is the place where your <b>content</b> will be. </body> </html> |
I will now explain all the tags that are used in the script. The <html>-tag used everytime you write a HTMl-script, this is a way to tell the browers that it is a HTML-script. The </html>-tag is the end of the HTML-script.
The following tag is the <head>-tag this is the information of your script. This will not appear in the browers. Also close this again with the </head>-tag to tell your browers that your header is ended.
The next tag is the <title>-tag here comes the title of you webpage, this will be displayed in the titlebar and the taskbar below this also have to be closed with the </title>-tag.
The <body>-tag and the </body>> between these two tags will your actual content come.
The <b> and </b>-tags will be explained a bit further in the tutorial.
If everything is correct you should see the following below:
| This is the place where you content will be. |
The HTML tags
The HTML-tags are surounded by the < and >-tag we call them brackets, most of the time these appear in pairs, the start and the end tag.
To come back to the example, the <b> is the start tag and the </b> is the end tag. This tells the browser that the text is bold untill the tags stop.
The basic HTML tags
The most common HTML-tags will I explain, more tutorials with advanced html-scripts will come later on.
First of all there is the Header-tag, these come from <h1> to <h6> were <h1> is the largest and <h6> is the smallest.
Look below for an example:
| <h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6> |
This will be showed as the following:
Heading 1Heading 2Heading 3Heading 4Heading 5Heading 6 |
Then we have paragraphs, these are started with the <p> and the </p>-tag this is very usefull because this will automaticly generate an extra blank line before and after the text.
| <p>This is a paragraph</p> <p>Here comes another paragraph</p> |
This should appear as:
This is a paragraph Here comes another paragraph |
And as end of this tutorial I will explain the comment and the line break tags. Comments are very easy when you are using a difficult or long script or when you want other scripters to use it.
We write a comment like this:
| <!-- This is a comment --> |
Next we have the line breaks, the are used like and hard return. You can use the <br>-tag for a line break or the <hr> to also use a line break but insert a line as return, if you don't get it, look at the following example.
| <!-- This is normal line break --> <br> <!-- This is line break with a line --> <hr> |
This will look like this:
This was it all for this tutorial if you want to learn more about HTML just come and revisit us later, I'm sure there will be much more tutorials added by the time then.
Thank you for reading.
discuss this topic to forum
