 |
HTML HELP
Lesson 1 - Getting Started
One of the first things to remember is that HTML is a tag based
language. This means that all commands should be placed within the greater
than and less than signs - < >. HTML also generally has
a start and ending tag. A start tag would look something like <html>
and an ending command would look something like </html>. What is
actually in the tag depends on what you are doing, but an ending tag always has
the / in front of the command. There are exceptions to this, but for the
most part most HTML commands do have a beginning and ending tag. HTML is also
not case sensitive. This means that you can use upper, lower, or a
combination of cases when creating your HTML. Generally speaking when you
are declaring a numerical value you are also declaring a pixel space. This
"generally" equals out to be one space. The more pixels wide or
high equals more pixels that are shown within an area. You can also declare
certain things in percentages. Such as table widths, heights, etc.
This will be demonstrated in the different lessons.
All pages will start with
similar tags, the HTML tag, the head tags, and the title tags. So when
looking at your code the initial code will most likely look something like the
example below if you removed everything but the main tags. If you're
starting your page by scratch in html you can probably just add the tags below
right off the bat. You will probably need most of them anyway. The tags
are also in the order you would have them on your site.
<html>
<title>
</title>
<head>
</head>
<body>
</body>
</html>
<html></html> tags
All pages should start with <html> tag and end with the
</html>. This is just stating that it's an HTML document. Some
browsers require it to view the page properly, others do not. Just to be
on the safe side I highly recommend using it. If your using a web editor
to create your site it will probably add this information for you.
<title></title> tags
These tags dictate what the customer sees at the top of the screen. You would
put what you want the customer to see between these tags. On this page I have <title>PayPalTech.com - Adrienne's Help Page</title>
set as the title. So at the very top of your browser you should see
PayPalTech.com - Adrienne's Help Page.
<head></head> tags
These tags are where a lot of various commands can go. If you are working
with any JavaScript, CSS (Cascading Style Sheets), or DHTML (Dynamic Hypertext
Markup Language) many times the commands for these will go between the head
tags. In the case of this page I have the CSS that control the mouse
link colors in my heading. You do not need this in your page I simply added it
as an example of something that would go in the head tag. <head>
<!-- START DHTML LINK COLORS/MOUSOVER COLORS -->
<style>
.textlinks a {text-decoration: none; color: #0274B2}
.textlinks a:hover {text-decoration: none; color:#5D5D5D}
body {font-family: Times New Roman}
</style>
<!-- END DHTML LINK COLORS/MOUSEOVER COLORS -->
</head> <body></body> tags This is exactly what
it states. This is where everything that shows up on your page will
appear. This is where your text, products, pictures, etc should show
up. There are many different things that you can call in the body tag. Font Color, Font Face, Marginheight, Marginwidth, Leftmargtin, Topmargin, background, bgcolor, etc.
The body tag for this apge looks like:
<body background="http://www.geekingout.us/imgs/bgrnd.jpg" bgcolor="#FFFFFF" leftmargin=0 marginwidth=0 marginheight=0 topmargin=0>
In this case the body tag is telling the background to be a picture name bgrnd.jpg, if the viewer cannot view pictures for the background to be white, and that the margin width, height, and top margin are set to 0 pixels. The last margin values tell the graphics of the page to give no space between the graphic and the top of the page. This helps the page look more professional if you have a graphic that would look out of place if given a space. Click Here to view what the page would look like if the margin properties are not declared. Notice the added white space, and how the background no longer aligns properly. To return to the home page simply close out of the new window that shows the example.
Top
|
 |
