Sebastian_33175 got their homepage at Neopets.com

Basic HTML

Sorry Not FireFox Friendly!!!

Need Help guest? Just neomail me, and I'll try to to help you out. Please post on the subject area "HTML or CSS Help

Hey, guest nice to see you around!
Welcome to my pet page... and sorry for the mess but it's still under construction... See everytime I get a question asked, I tried to add your answers here to my page. That way if you happen to forget your answers are all here to stay... We'll get it straight sooner or later... Let me know if you need anything...

If you don't happen to find it here you can always go to our Web Site, NeoCozyCorner. There you can find almost everything, and if not just drop us a line and we will get it for you.

Here we have some Basic Html Coding:

In order for you to do any kind of Web Page you need to know the Basics Html Codes. Here You will find a quick and simple explination of what you need to know starting with the definition of HTML, which stands for Hyper Text Mark-up Language. These are the codes that mostly all web pages are written in. These codes are always going to be in triangular brackets.
Everything you add to the webpage you make must be in these brackets: .
These brackets are also known as tags! Which are the Commands that tell the computer what it is you are doing. The most common mistake that people do is not to end the tag. A tag must have a Beginning and an End! Also you must remember that the ending to most of the commands need to be ended by putting a backslash / right before the closing tag. For example if you want your text in bold you must write it like this:

it would show up like this:
Your bold text!

Here you have the Basics Tags
(Codes) that every web page you make must have;
HTML The title to your page Everything you add to your webpage will go between the beginning body tags and the end body tag. /HTML
Just remember that you need every tag in order to properly display your content. We wouldn't want any part of Sebastian the Kougra to be missing. Would we?

For more Html Help you can refer to our Html Help Page on the web, coming soon.

Here we have some Basic Table Coding:

The 1 Colunm Basic Table Coding Looks like this:

Put your stuff here... You can insert text and images...Also you can change the width of the table and add a background color or a background image.

The 3 Columns Basic Table Coding

Looks like this:

This is the First Column.
Remember you have to make each column width equal to the total width of the table.

This is the Second Column.
If your table is 300, then each column should be 100 each or 50, 50, & 200.

This is the Third Column.
You can insert text and images...Also you can change the width of the table and add a background colors.

Table with Heading Cell and 2 Rows and 2 Columns
<table width="300" border="4"> <tr> <td colspan="2"><center> <p>YOUR HEADING GOES HERE </p> </center></td> </tr> <tr> <td> YOUR TEXT OR IMAGE HERE </td> <td> YOUR TEXT OR IMAGE HERE </td> </tr> <tr> <td> YOUR TEXT OR IMAGE HERE </td> <td> YOUR TEXT OR IMAGE HERE </td> </tr> </table>

Looks like this:

YOUR HEADING GOES HERE
COL 1, ROW 1	COL 2, ROW 1
COL 1, ROW 2	COL 2, ROW 2

Inserting Images

Here are some Neopet Images

that you can insert in the Tables.

To insert an image all you need to do is follow these steps.
In the Text Boxes above are some image tags. Copy the Tag and Paste it where you want it to go, and your finished.
If you have a different image you would like to use just change the URL to where your image is, then your image should show up..
To get an image from Neopets just right click on the image and look at the properties, there you will find the URL copy that and add the following codes to the front;

guest, if you would like me to get an image for you, just neomail me and I'll get it and place it in a text box for you to copy and paste...
Here is the code to remove the white around your images...

Alignment of Images with Text

Alignment	Description	Codes
ALIGN="left	The image will be aligned left and the text will be aligned to the right.	<img src="http://images.neopets.com/pets/80by80/kougra_yellow_happy.gif" height="80" width="80" border="5" alt="Sebastian HTML & CSS Help!">
ALIGN="right	The image will be aligned right and text will be aligned to the left.	<img src="http://images.neopets.com/pets/80by80/kougra_yellow_happy.gif" height="80" width="80" border="5" alt="Sebastian HTML & CSS Help!">
ALIGN="left ALIGN="right	Two images, One will be aligned to the left the other to the right with text in the center.	<img src="http://images.neopets.com/pets/80by80/kougra_yellow_happy.gif" height="80" width="80" border="5" alt="Sebastian HTML & CSS Help!"><img src="http://images.neopets.com/pets/80by80/kougra_yellow_happy.gif" height="80" width="80" border="5" alt="Sebastian HTML & CSS Help!">
ALIGN="left HSPACE="40"	One image aligned to the left with the text separated by space. The space is determine by the amount you put in.	<img src="http://images.neopets.com/pets/80by80/kougra_yellow_happy.gif" height="80" width="80" border="5" alt="Sebastian HTML & CSS Help!">

Here we have Coding for Backgrounds:

Here is the code for adding an Image as a background.

Here is the code for making your background a single color.
<style type="text/css"> body { background: color you want here; } </style>

Here we have Text Box Coding:

When your using a Text Box in your pet's page Neopets does not allow you to directly use the word "TEXTAREA". You must place an underscore ( _ ) between (text) and (area) in both the begining tag and the closing tag.

The rows determine how long your text box is.
The cols determine the width of your text box.

Fun with Fonts

Changing the color of Fonts and the Actual Font Family?

Making the Font to Glow
<style type="text/css"> td, p { } </style>
You can change the glow color to any color you like.

Changing Font Format

Bold <b>Your Text Here</b>	Underline Your Text Here	Italics <i>Your Text Here</i>
Strikeout Put an <font color="#FF0000">S</font> in brackets	Small Your Text Here	^{Superscripted} <sup>Your Text Here</sup>

Here is the Code to Align your text in the middle:

Text Alignment in the Center

Changing the Colors of your Scrollbar.

Here is the code to change the colors of your scroll bar.
To get different color use the Chart at the bottom of this Page.

Internal Tags (Anchors)

This goes in the Index These tags are called are internal tags. They can be used for Text or Images. An Internal tag will make the text or image clickable to another section of your page. These are also called links.	<a name="#Top">Navigation Bar</a> This goes on the top of the Page
This goes where you want the Index clickable to go too.	<a href="#Top">Take Me to the Top</a> This goes where you want it to click too.

Also you may put an image where you put the name of the page that it's going to.
<a>Here you put where it is going to or an image tag...</a>

Here we have some Fun Stuff to make your pages Exciting:

Marquee's
Marquee's are a nice way to get your message across. You may place them anywhere on you page. Here you will find the codes for different marquee's. You may change the colors and the font to your liking...

The code above is your basic Marquee with a colored background (side scroll). Below you will find the code for a marquee that scroll up.

The last code is the code to control how fast it scrolls or how slow it scrolls. You control it by changing the amount.

How to flip image while Hovering
With this code your Image or text will flip when it is clicked. A:HOVER{color: white; font-size:7pt;height:7pt;filter:flipv;}td,p,font,body{color:519CBB;font:8pt arial} p { letter-spacing: 1px; }
Remember this code in place of the hove code you have now...

Here we have some Codes to change your Shield:

Change the Shield

Change the pic in Shield

Adding or Removing Stuff

Here is the code to Add your own Image for the Sidebar.

You need to replace your URL with the one that I provided for you, unless of course you want to use it...

Here is the Code to REMOVE the YELLOW Sidebar
<style> #m, #n, #mb { display: none; } table, td { background: transparent; } p img { } </style>
With this Code you remove most of Neopets Default. (banner, sidebar, and more) <style type="text/css"> #m, #n, #mb, table, td { background: none; } #object { display: none; } </style>
With this code you remove the top banner. <style> #ban { display: none; } </style>

Hexadecimal Color Chart:

SeaShell - #fff5ee
Pink- #ffc0cb
LightPink - #ffc6c1
MistyRose - #ffe4e1
HotPink - #ff69b4
DeepPink - #ff1493
PaleVioletRed - #db7093
MediumVioletRed - #c71585
Plum - #dda0dd
Violet - #ee82ee
Fuchsia - #ff00ff
Magenta - #ff00ff
DarkMagenta - #8b008b
Orchid - #da70d6
MediumOrchid - #ba55d3
DarkOrchid - #9932cc
BlueViolet - #8a2be2
DarkViolet - #9400d3
Purple - #800080
Indigo - #4b0082
MediumPurple - #9370db
Papayawhip - #ffefd5
Peachpuff - #ffdab9
Moccasin - #ffe4b5
Red - #ff0000
Darkred - #8b0000
Maroon - #800000
IndianRed - #cd5c5c
Crimson - #dc143c
FireBrick - #b22222
Orange - #ffa500
DarkOrange - #ff8c00
OrangeRed - #ff4500
Coral - #ff7f50
LightCoral - #f08080
Salmon - #fa8072
LightSalmon - #ffa07a
DarkSalmon - #e9967a
Peru - #cd853f
SandyBrown - #f4a460
Chocolate - #d2691e
SaddleBrown - #8b4513
RosyBrown - #90483E
Lavender - #e6e6fa
LavenderBlush - #fff0f5
Thistle - #d8bfd8

Aqua - #00ffff
Cyan - #00ffff
LightCyan - #e0ffff
Darkcyan - #008b8b
Teal - #008080
PaleTurquoise - #afeeee
Turquoise - #40e0d0
MediumTurquoise - #48d1cc
DarkTurquoise - #00ced1
CadetBlue - #5f9ea0
SteelBlue - #4682b4
LightSteelBlue - #b0c4de
PowderBlue - #b0e0e6
SkyBlue - #87ceeb
LightSkyBlue - #87cefa
MediumSlateBlue - #7b68ee
SlateBlue - #6a5acd
DarkSlateBlue - #483d8b
DeepSkyBlue - #00bfff
CornFlowerBlue - #6495ed
RoyalBlue - #4169e1
DodgerBlue - #1e90ff
LightBlue - #add8e6
MediumBlue - #0000cd
Blue - #0000ff
DarkBlue - #00008b
Navy - #000080
MidnightBlue - #191970
SlateGrey - #708090
LightSlateGrey - #778899
DarkSlateGrey - #2f4f4f
Gainsboro - #dcdcdc
LightGrey - #d3d3d3
Silver - #c0c0c0
DarkGrey - #a9a9a9
Grey - #808080
DimGrey - #696969
AntiqueWhite - #faebd7
Bisque - #ffe4c4
CornSilk - #fff8dc
BlanchedAlmond - #ffebcd
Wheat - #f5deb3
Tan - #d2b48c
NavajWhite - #ffdead
Burlywood - #deb887
Beige - #f5f5dc

Gold - #ffd700
Yellow - #ffff00
LightYellow - #ffffe0
LemonChiffon - #fffacd
PaleGoldenrod - #eee8aa
LightGoldenrodYellow - #fafad2
GoldenRod - #daa520
DarkGoldenRod - #b8860b
Linen - #faf0e6
Oldlace - #fdf5e6
FloralWhite - #fffaf0
Ivory - #fffff0
Honeydew - #f0fff0
Mintcream - #f5fffa
Azure - #f0ffff
AliceBlue - #f0f8ff
GhostWhite - #f8f8ff
WhiteSmoke - #f5f5f5
Snow - #fffafa
White - #ffffff
Aquamarine - #7fffd4
MediumAquamarine - #66cdaa
MediumSpringGreen - #00fa9a
SpringGreen - #00ff7f
PaleGreen - #98fb98
GreenYellow - #adff2f
Chartreuse - #7fff00
LawnGreen - #7cfc00
Lime - #00ff00
LightGreen - #90ee90
YellowGreen - #9acd32
LimeGreen - #32cd32
MediumSeaGreen - #3cb371
DarkSeaGreen - #8fbc8f
ForestGreen - #228b22
LightSeaGreen - #20b2aa
SeaGreen - #2e8b57
Green - #008000
OliveDrab - #6b8e23
Olive - #808000
DarkOliveGreen - #556b2f
DarkGreen - #006400

Black - #000000