Simple HTML Tutorial

cyberdemon · 09-24-2008, 12:11 PM

This is a simple tutorial for using the html code. Please note that although you can use this code to build a website from scratch, I'm not gonna describe how to build it and I'm not going to go into much detail.

Note: This tutorial has been made upon request from a member and will make it to meet her needs.

Let's begin...

The Basics
So, you want to make a bulletin in html but don't know anything about it. Fortunately, you don't need to be a code geek to know this language as its pretty easy.

Now, I would like you to keep in mind this thing first: Your PC is a stupid fat s*it sitting there and absorbing electricity.

Since the PC is stupid, we need to tell him, "Hey, we're using html here so work with html or I'll kick your a**!"
In html we do this by inputting these codes:
<html>
</html>

"Why the fu** did you put two codes the same?"
The first tells the PC to start using html. The other one which ends in "/" tells the PC to stop using that code. Its like saying this:
<html> (Once apon a time)
</html> (and they lived happily ever after... naaaaaaaat!!)
You can have other functions other than html like <img></img>, <td></td>, <table></table>. I will revise these later.
So wherever you see <code> means that its the start and when you see </code> it means the end.

Head
In the head, we will put the page properties. These will be the meta and the title. the code should be:
<head>
{Put the meta code here}
{Put the Title code here}
</head>

Meta
Then comes the meta. The meta is something that isn't shown on the screen but is present in the properties.
Just copy and paste this:
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

Please note that meta does not end.

Title
We should set a title to the page. So in order to do this we use:
<title>Cyberdemon's the King!</title>

Body
Everything you put in the body will be visible on the screen.
Code:
<body>
</body>

You may give a colour to the body to give colour to the whole page. In this case you do:
<body bgcolor="#000000">
</body>

Note that only the first code has been modified. The color is set into 6 number, in which each 2 represent the 3 primary color in this order: Red Green Blue. Note that these are in Hexadecimal and may range from 0 to F.

Everything we are going to do now is going to be in the body!

Tables
Tables are used to write and text and show images on them.

<table border="0"{How fat is the border} width="100%"{how wide the table is}>
<tr>
<td>{here you put or write anything you want}</td>
</tr>
</table>

You can also give custom properties to fonts, like color by doing this:
<font color="#0000CC">{your text}<font>

The code will together come:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
</head>

<body bgcolor="#000000">

<table border="0" width="100%">
<tr>
<td> </td>
</tr>
</table>

</body>

</html>

Some more code you can use in the <td>{right here}</td>

Quote:

<img>{image URL}</img> -> gives an image

Edit... thanks Pac
Blasphemy!!

lol...

The concept is true, but for that specific case of Img tag... its more like <img src="URL" alt="TITLE" />

You close the tag with "/>" heheh
where src is the source of the file (URL) and alt is the alternative to the image (text)

<br> -> Starts a fresh new line
<b>{text}</b> -> bold
<i>{text}</i> -> italics
<u>{text}</u> -> underline

That's all folks.

sasuke · 09-24-2008, 12:43 PM

i hope you dont mind but im just going to add a little to this.

You can write your own coding within a plain text editor, such as Note Pad, or use an HTML editor which will write the code for you. if your not to big on doing it all yourself or not learning it then just use that alot simpler.

The opening bracket is followed by an element, which is a browser command, and ends with the closing bracket.

<font size=2>

An element may also be followed by attributes, which are words describing the properties of the element, and further instruct the browser.

<font size=2>

Attributes are only contained in the opening HTML tags to the right of the element and are separated by a space and followed by an equal (=) sign.

The value follows the equal sign and is enclosed in quotes.

<font size=2>

useful things to kno

<HTML> - Begins your HTML document.

<HEAD> - Contains information about the page such as the TITLE, META tags for proper Search Engine indexing, STYLE tags, which determine the page layout, and JavaScript coding for special effects.

<TITLE> - The TITLE of your page. This will be visible in the title bar of the viewers’ browser.

</TITLE> - Closes the HTML <TITLE> tag.

</HEAD> - Closes the HTML <HEAD> tag.

<BODY> - This is where you will begin writing your document and placing your HTML codes.

</BODY> - Closes the HTML <BODY> tag.

</HTML> - Closes the <HTML> tag.

i know some codes you allready had in there cyber but if i didnt know anything about coding i might have found it a bit hard to understand but very nice job on the tutorial

u did a great job

cyberdemon · 09-24-2008, 03:22 PM

not at all sasuke. I really appreciate it. I got a bit tired writing the tutorial

BTW, if anyone has Microsoft Frontpage on their PC, you can edit your html code there.

sasuke · 09-24-2008, 04:25 PM

Quote:

Originally Posted by cyberdemon

not at all sasuke. I really appreciate it. I got a bit tired writing the tutorial

BTW, if anyone has Microsoft Frontpage on their PC, you can edit your html code there.

i use notepad lol but thats because i used html for years back in collage in the good old days

Nykocide · 09-24-2008, 04:40 PM

Thanks sooo much guys!!! I really appreciate this information. But I hope that soon you can talk about BBCode as well. -thinks- but that might be a different thread.

cyberdemon · 09-24-2008, 04:45 PM

Quote:

Originally Posted by Nykocide

Thanks sooo much guys!!! I really appreciate this information. But I hope that soon you can talk about BBCode as well. -thinks- but that might be a different thread.

BBCode?? You're joking right? It is sooooooooooooo easy.

its kinda the same but instead of using the <> you use []

sasuke · 09-24-2008, 11:15 PM

Quote:

Originally Posted by cyberdemon

BBCode?? You're joking right? It is sooooooooooooo easy.

its kinda the same but instead of using the <> you use []

lol i did BB code in school XD but some people might not have got the chance like nyko and are willing to learn it. and thats a good thing

btw cyber what do you know about C++ have u worked with it at all ?

Nykocide · 09-25-2008, 01:16 AM

ugh, now that's what I worked on in college. It was too much for me since the lecture was monotone. -sighs-

Vincentre · 09-25-2008, 02:25 AM

You are a saint. One of these days I'm going to actually read all of it, but since it's pretty long...I'm gonna have to build up some courage.

I was trying to learn HTML so I could make layouts and stuff and this looks really helpful.

Gratias Tibi Ago.

Nykocide · 09-25-2008, 05:56 AM

gratias maximas tibi ago

Sponsored links
Ventrilo Server	Teamspeak Servers	COD4 Game Servers

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)