| Moira's profile♥(¯`v´¯)♥ мøï®α ♥(¯`v´¯)...PhotosBlogLists |
|
November 09 How to make tables!
Ok I'm going to tell you how I make my tables. There are other ways but I prefer using this method. I will not be going into detail on how to edit the pictures for your tables but I will put in a few good links at the bottom. So at this point you need to have the picture you'd like to use for the table. It must be normal sized.. you cannot change its size from the code. At least I don't think you can :P So for editing my images I use these 2 programs which I suggest you'd have:Jasc Paintshop Pro [55Mb] [Download Now]
Microsoft GIF Animator [1.1Mb] [Download Now]
Now I suggest you'd open a new notepad and save this code somewhere practical you can easily find it. You'll need to use it for every table.NOTE: The text in red is what you will need to change later on to modify your table.
<DIV align=center>
<TABLE height=410 cellSpacing=0 cellPadding=0 width=361 background=http://replace/thistext.gif border=0> <TBODY><TR> <TD width=85 height=85></TD> <TD width=231 height=85></TD> <TD width=96 height=237 rowSpan=2></TD></TR> <TD width=85 height=152> </TD> <TD width=231 height=152> <DIV style="SCROLLBAR-FACE-COLOR: #FFFFFF; LEFT: 306px; FLOAT: right; OVERFLOW-X: hidden; OVERFLOW: scroll; WIDTH: 226; SCROLLBAR-3DLIGHT-COLOR: #000000; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-BASE-COLOR: #000000; HEIGHT: 194"> <P align=center>TYPE UR TEXT IN HERE</P> </DIV></TD></TR> <TD width=85 height=58></TD> <TD width=231 height=58></TD> <TD width=96 height=58></TD></TR></TBODY></TABLE></DIV> Now copy and paste the code in a new blog entry in the <HTML> part; you need to click <HTML> module once to be in <HTML> part. You'll find <DIV></DIV> just backspace those. Open another Internet Browser and upload your image. I suggest www.tinypic.com it's fast and easy!
Copy the link of your picture and paste instead of the red text just after "background=" Make sure you don't leave any spaces. Now click <HTML> again to see your table, and what needs to be modified.
If your picture looks small and it has exceeded its size try lowering the numbers on the top of the code where it says "TABLE height= width=" try typing smaller numbers depending on how small your height and width should be till you are satisfied with your picture.
The same thing applies if your picture is big and it doesn't appear well, in that case you'd need to type bigger numbers.
Now for the scrollbar, click <HTML> to preview your table, click once on the scrollbar and it allows you to resize it to the size that you want. Then click and drag to where you want it to be placed. This doesn't always allow you to place it wherever you want so I use this method: If I want the scrollbar to move more to the right hand side, I increase the numbers in the "TD width=" again depending on how much I want it to move to the right. The same thing applies if I want to move my scrollbar to the left hand side.. I decrease the numbers and make them smaller; all of them!
Now for moving up and down I change the numbers in the "height=" again if I want it to move downwards I put a bigger number and if I want it to move upwards I put a smaller number. Just remember it doesn't have to be exact!
Now for the colors of the scrollbar I use this website for choosing the colors. There are tons of others but that's your choice of course! Try experimenting with colors and changing the codes that are already there if you like. Here's a few basic ones:#000000
#ff0000
#ffff00
#0000ff
#008000
So if you've made it to this point, you are now officially a table maker :P Remember to put your text from the <HTML> part that's in the code and not in preview mode where you are seeing your table, because that can stuff up your table when you delete the text, to type your own! And if you want to put the table code in your table (as I do in my tables pages) just copy the code from the <HTML> part then paste it in your table in normal mode (when you are seeing your table; click twice on the scrollbar then press Paste at the top) Few helpful tutorials NOT made by me![]() Comments (47)
TrackbacksThe trackback URL for this entry is: http://moira-x.spaces.live.com/blog/cns!435B98E2988FF4D3!203.trak Weblogs that reference this entry
|
|
|