Wednesday, October 12, 2005

CSS/Html Help

Due to popular request, I'm gonna make a -simple- CSS/Html guide. It's mainly going to focus on the beginning steps to beautifying your profile, and I'm not going to go into advanced coding. It's my first time, so please bear with me, if my explanations are not clear. And please DO leave a comment so I can always edit this post if I have incorrect info.


*Background*
From now on, background will be referred to as bg. Remember that.
I'm assuming you already have a bg in mind, so make sure it is the correct size to fit your screen resolution. (1024x768 etc.)



To make sure your bg is the correct size, press Print Screen. You should have your internet browser (Internet Explorer, Firefox, Netscape etc.) open when you do this. The button is located somewhere above the up and down keys. After that, open MS Paint (which is what I use) and paste it there. Now take your bg pic and place it over the image. To do this, select "Paste From" from the toolbar. Edit it to fit properly over the image. *Make sure you fit the picture properly, DO NOT INCLUDE the tool bars and etc.* Place it over what you would see in your browser ONLY. Now that you have your correct size, cut out your bg (not including tool bars etc.) and paste it on a new page. Save it.


Now that you have the correct size, you have to host your bg pic. You can use this website: http://www.imageshack.us/


You can upload a maximum of 1024KB. Browse for your pic and click 'Host it'. Use the second last code on the page.


So now you have your bg code, which is: body{background:url(PUT URL HERE)


*Note: Ok, I left this out last night. At the very beginning of your code, you need to put this: <style type="text/css">After that, every following tag will need to have <style>at the beginning, and </style> at the end.


So your bg code will look like this: <style>body{background:url(PUT URL HERE)</style>


So far, your whole code will look like this:
<style type="text/css">

<style>body{background:url(PUT URL HERE)</style>



There are other codes to adjust your pic, but as I have already instructed you to adjust your pic before you host it, It should fit just fine.


To be continued...

No comments:

Post a Comment