Well as i'm bored out of my mind i thought i'd write a long HTML guide.
Basic HTML.
Open Notepad.
This starts off your HTML page<HTML>
This Starts off your header section<Head>
These are header codes.
Is for background colour.<Body bgcolor="Hex">
Is for a CSS style.<style type="text/css">
Thats linking a external stylesheet.<LINK REL=stylesheet HREF="http://www.your.page/css.css" TYPE="text/css">
This ends the header section. we'll move on now.</head>
This starts your body section.<Body>
Now theres a lot of body tags we're going to use a few of them.
First the basic text tags.
In order they do:<P> <B> <U> <BR> <Hr>
New paragraph, Bold text, Underlined, Break, Horizontle rule.
So at the moment you could have:
Now this really doesn't do much. so lets move on quickly.<Html>
<Head>
<Title>Your Site</Title>
<style type="text/css">
</Head>
<body>
<P><B>Look My Text Is Bold.</B>
<Br> Look what happened here.
</Body>
</Html>
You have set your font font size and font colour with that tag, Although many people use CSS for that now. We'll do the CSS later.<font face="your font" size="your size #" color="#your color number">
This is a hyperlink and using that and typing Http://www.HabboxForum.com would if you clicked it take you to habbox forum.<a href="http://address you want text to link to">
This is inserting an image into your page.<img src="Image.png">
<div align="center"><img src="Habbo.gif"></div><div align="left"><img src="Habbo.gif"></div>These are aligning your images.<div align="right"><img src="Habbo.gif"></div>
This is an email link. Time to move on.<a href="mailto:your address">your name</a>
This is a simple 4 cell table tag. You can change border to anything and if you don't want a border simply put <table border="0"><table border="1">
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
</tr>
<tr>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
</table>
This would add colour to your tables use any hexademical code.<table border="2">
<tr>
<td bgcolor="#000000">Cell 1</td>
<td bgcolor="#000000">Cell 2</td>
</tr>
<tr>
<td bgcolor="#000000">Cell 3</td>
<td bgcolor="#000000">Cell 4</td>
</tr>
</table>
Cell spacing and padding really are what they say.<table border="2" cellspacing="4" cellpadding="4">
Theres your table width.<table border="2" cellpadding="5" cellspacing="5" width="200">
thats to add a background image to your table.<table style="background-image:url(yourfilename.gif)">
Now just mess around with the table codes etc. We'll move on now.
What that does is simply get rid of the underlining links.<style type="text/css">
Aink {text-decoration:none; }
A:visited {text-decoration:none; }
</style>
What that does is change your bg color to grey instead of HTML code, change ur link colour, and a useful script everytime u use h1 h2 or h3 the properties of that text are already made plus CSS codes make ur load time quicker.<STYLE TYPE-"type/css">
<!--
BODY {background: #C9C9C9}
Aink {color: #FF0000}
A:visited {color: #FF00FF}
H1 {font-size: 24pt; font-family: arial}
H2 {font-size: 18pt; font-family: braggadocio}
H3 {font size:14pt; font-family: desdemona}
-->
</STYLE>
That positions your image.<IMG STYLE="position:absolute; TOP:35px; LEFT:170px; WIDTH:50px; HEIGHT:55px" SRC="Habbo.gif">
Thats good because it adds a border around your text.<P STYLE="border: double #000000 10px">
You have different border types.<STYLE>
P {border-style: inset}
</STYLE>
For scrollbars to make your scrollbar blend in with your background [this only works in IE]<style type="text/css">
<!--
.scrollbar2 {
scrollbar-3dlight-color:#ffd700;
scrollbar-arrow-color:#ff0;
scrollbar-base-color:#ff6347;
scrollbar-darkshadow-color:#ffa500;
scrollbar-face-color:#008080;
scrollbar-highlight-color:#ff69b4;
scrollbar-shadow-color:#f0f;
scrollbar-track-color:#800080;
}
This is the iframe code where many people have a content box, But i prefer using PHP includes but for beginners iframes are better.<IFRAME name="inlineframe" src="yoururl.html" width=200 height=200 marginwidth=0 marginheight=0 frameborder=0 scrolling=auto></IFRAME>
Now using this tutorial you could create a basic table layout with some interesting CSS in it.
For more tutorials etc try the following sites:
www.Htmlgoodies.com
www.Lissaexplains.com
www.w3schools.com
www.Dynamicdrive.com
www.PHPfreak.com
For cutenews www.Cutephp.com
For tutorials on photoshop etc.
www.Pixel2life.com
www.Xenigma.co.uk
www.Bright-designs.net
Bare in mind this is my first detailed tutorial and it may not be that good but oh well i just want to help people learn the basics.





ink {text-decoration:none; }
Reply With Quote



