You are viewing our Forum Archives. To view or take place in current topics click here.
HTML Tutorial | The Basics.
Posted:

HTML Tutorial | The Basics.Posted:

Calvee
  • TTG Senior
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57

Here's the Basics of HTML, and some <tags> that you may find useful.
Here's the basics of the HTML tags.
Open up a empy notepad ( I recommend Notepad++ google it.)
And type the following:
<html>
<title> Title goes here </title>
<body>
Main body of the website goes here.
</body>
</html>


Here's the basics of HTML :
The "<html>" tag opens the website, and the "</html>" tag closes it, any tag with "</>" is a closed tag.


Here's some useful <tags> you might want to experiment with:

<b>Text goes here</b> - Makes the text bold.

<u>Text goes here</u> - Underlines the text.

<center>Text goes here</center> - Aligns the text central.

<br> - Creates a break line, just like hitting enter.

<a href="http://www.google.co.uk">Google!</a> - Anchor, it creates the "Google!" text so users can click on it and be redirected to Google.

<font face="Times New Roman" size="+3" color="#ff0000">Text goes here.</font> - This changes the Font, the Size and the Color; Google the color codes.

<hr width="75%" color="#ff0000" size="4" /> - A horizontal rule, again the color codes can be found on Google.

<img src="Name of the image.format of the image" width="41" height="41" border="0" alt="text describing the image" /> - Imports an image to your webpage, I recommend putting everything into a folder, and just having the images loose.





Here's some more advanced <tags> you might want to mess around with at a later date:

<form action="mailto:[email protected]">
Name: <input name="Name" value="" size="10"><br>
Email: <input name="Email" value="" size="10"><br>
<center><input type="submit"></center>
</form> - Adds a form, so people can email you via your website with ease.

<form method=post action="/cgi-bin/example.cgi">
Enter Your Comments:<br>
<textarea wrap="virtual" name="Comments" rows=3 cols=20 maxlength=100></textarea><br>
<input type="Submit" value="Submit">
<input type="Reset" value="Clear">
</form> - Input field, this can be used to submit questions to the Domain Admin, but this needs some PHP&CSS Scripting.

<form method=post action="/cgi-bin/example.cgi">
Select an option:<br>
<input type="radio" name="option"> Option 1
<input type="radio" name="option" checked> Option 2
<input type="radio" name="option"> Option 3
<br>
<br>
Select an option:<br>
<input type="checkbox" name="selection"> Selection 1
<input type="checkbox" name="selection" checked> Selection 2
<input type="checkbox" name="selection"> Selection 3
<input type="Submit" value="Submit">
</form> - Another input field, but this has boxes that you can "tick" and submit, so it's a tad like a poll.

<menu>
<li type="disc">List item 1</li>
<li type="circle">List item 2</li>
<li type="square">List item 3</li>
</MENU> - List, the "disc"/"circle"/"square" are different images you can chose the one you prefer .

<marquee bgcolor="#cccccc" loop="-1" scrollamount="2" width="100%">Text goes here. </marquee> - Makes the text scroll.

<table border="2" cellpadding="2" cellspacing="2" width="100%">
<tr>
<td>Column 1</td>
<td>Column 2</td>
</tr>
</table> - Table, this is the main table I use, again you can edit the colors. Any <tag> with "#random numbers/letters" is a color and can be edited.


Here's a little example of what you should be getting whilst using these <tags>:
<html>
<title> Tutorial Website. </title>
<body>
<center><font face="Century Gothic" size="+7"Welcome to the Homepage!</font></center>
<br>
<hr width="60%" color="#ff0000" size="7" />
<br>
<a href="http://www.youtube.com/ChannelGoesHere">Subscribe to us on Youtube!</a>
<br>

</body>


If you need any additional help with programming, then feel free to PM me.

I would do some C#/C++/Java but people have already done those and they've been stickied so I won't bother.

Calvee.

The following 1 user thanked Calvee for this useful post:

Slagveld3 (01-19-2012)
#2. Posted:
Z61
  • TTG Fanatic
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
Lol, where did you learn html? this "tutorial" is horribly broken and outdated.
#3. Posted:
Calvee
  • TTG Senior
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Z61 wrote Lol, where did you learn html? this "tutorial" is horribly broken and outdated.

Broken? I think you'll find it's the "Basics" like the very basics.
HTML isn't outdated, at-all.People just don't use Notepad much, they'd rather use MySQL, Joomla, ect..

This tutorial consists of a couple extremely basic HTML tags, for the people who want to start HTML.
#4. Posted:
Z61
  • V5 Launch
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
xCalvy wrote
Z61 wrote Lol, where did you learn html? this "tutorial" is horribly broken and outdated.

Broken? I think you'll find it's the "Basics" like the very basics.
HTML isn't outdated, at-all.People just don't use Notepad much, they'd rather use MySQL, Joomla, ect..

This tutorial consists of a couple extremely basic HTML tags, for the people who want to start HTML.

You are quite out there, lol.
The html you use is heavily outdated.
#5. Posted:
illusionzXD
  • Ladder Climber
Status: Offline
Joined: Sep 28, 201013Year Member
Posts: 394
Reputation Power: 17
Status: Offline
Joined: Sep 28, 201013Year Member
Posts: 394
Reputation Power: 17
This tutorial really refreshed my mind.
Last time I learned it was in 8th grade in class.
3-4 years ago.
Thanks for bringing this up man, good work.
#6. Posted:
Calvee
  • TTG Senior
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Z61 wrote
xCalvy wrote
Z61 wrote Lol, where did you learn html? this "tutorial" is horribly broken and outdated.

Broken? I think you'll find it's the "Basics" like the very basics.
HTML isn't outdated, at-all.People just don't use Notepad much, they'd rather use MySQL, Joomla, ect..

This tutorial consists of a couple extremely basic HTML tags, for the people who want to start HTML.

You are quite out there, lol.
The html you use is heavily outdated.





Can you not read?
This is the BASICS of HTML, like I said, people don't use manual programs much anymore, it's all about snippets with most programmers, but I thought it'd be a good idea for people to understand and grasp the BASIC knowledge of HTML <tags>

If you don't like it, then fine; Haters gonna' hate.
Calvee.
#7. Posted:
Calvee
  • TTG Senior
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
illusionzXD wrote This tutorial really refreshed my mind.
Last time I learned it was in 8th grade in class.
3-4 years ago.
Thanks for bringing this up man, good work.





Thank-you for the positive feedback.
Calvee.
#8. Posted:
Z61
  • TTG Fanatic
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
xCalvy wrote
Z61 wrote
xCalvy wrote
Z61 wrote Lol, where did you learn html? this "tutorial" is horribly broken and outdated.

Broken? I think you'll find it's the "Basics" like the very basics.
HTML isn't outdated, at-all.People just don't use Notepad much, they'd rather use MySQL, Joomla, ect..

This tutorial consists of a couple extremely basic HTML tags, for the people who want to start HTML.

You are quite out there, lol.
The html you use is heavily outdated.





Can you not read?
This is the BASICS of HTML, like I said, people don't use manual programs much anymore, it's all about snippets with most programmers, but I thought it'd be a good idea for people to understand and grasp the BASIC knowledge of HTML <tags>

If you don't like it, then fine; Haters gonna' hate.
Calvee.

No, I use Notepad++ and only that, though you are using a Version of html I have never even seen, we are at HTML5, and this will not read through a newer browser.
So you, need to read what I'm saying and actually learn some HTML and not copy and paste.
#9. Posted:
Saskatoon
  • TTG Senior
Status: Offline
Joined: Oct 07, 201112Year Member
Posts: 1,369
Reputation Power: 60
Status: Offline
Joined: Oct 07, 201112Year Member
Posts: 1,369
Reputation Power: 60
Cool tutorial! Keep it up!
#10. Posted:
Calvee
  • TTG Senior
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Status: Offline
Joined: Jun 13, 201112Year Member
Posts: 1,360
Reputation Power: 57
Z61 wrote
xCalvy wrote
Z61 wrote
xCalvy wrote
Z61 wrote Lol, where did you learn html? this "tutorial" is horribly broken and outdated.

Broken? I think you'll find it's the "Basics" like the very basics.
HTML isn't outdated, at-all.People just don't use Notepad much, they'd rather use MySQL, Joomla, ect..

This tutorial consists of a couple extremely basic HTML tags, for the people who want to start HTML.

You are quite out there, lol.
The html you use is heavily outdated.





Can you not read?
This is the BASICS of HTML, like I said, people don't use manual programs much anymore, it's all about snippets with most programmers, but I thought it'd be a good idea for people to understand and grasp the BASIC knowledge of HTML <tags>

If you don't like it, then fine; Haters gonna' hate.
Calvee.

No, I use Notepad++ and only that, though you are using a Version of html I have never even seen, we are at HTML5, and this will not read through a newer browser.
So you, need to read what I'm saying and actually learn some HTML and not copy and paste.





I know how to program. I have been programming for about 3 years. I know a lot more about programming then most of the members on TTG, and probably more then you.
This "version" as you claim will run through any web-browser. You clearly have no understanding of how the <html> tags work. *sigh* and I didn't "copy & paste" anything, this is all entirely mine.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>HBS &bull; Home</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
   <div id="logo">
      <p></p>
      <h3>Hammond Building Services.</h3>
   </div>
   <hr />
   <!-- end #logo -->

That is the programming language I use for my websites but that isn't "basic" and people would not understand, so it's best to learn the basics before going into advanced stuff, plus that uses "scripting" which if you don't know is this:
body {
   margin: 0;
   padding: 0;
   background: #fff url(images/img01.jpg) repeat-x left top;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #000;
}

h1, h2, h3 {
   margin: 0;
   text-transform: uppercase;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: normal;
   color: #000000;
}

h1 { font-size: 44px; }

h2 { font-size: 18px; }

h3 { }

p, ul, ol {
   margin-top: 0;
   line-height: 100%;
   text-align: justify;
}

ul, ol { }

blockquote { }

a { color: #0564fd; }

a:hover { text-decoration: none; }


All of the above code snippets are from my website that I am curerntly making for my Buisness. So don't claim I am copying and pasting anything, as I don't.


Calvee.
Jump to:
You are viewing our Forum Archives. To view or take place in current topics click here.