heyyyy
15 years, 3 months & 26 days ago
17th Aug 2010 14:06 Ok first part: basic;
<b>text here</b> makes the text bold
<u>text here</u> makes texts underlined
<i>text here</i> makes the text italic
<br> Starts a new line
Headers
Headers appear in the style slightly different as to make them look good on a background you must add different aspects.
h1 stands for header 1.
headers usually have a background color so that is added too.
the line height is the height of the background.
h1
{font-size:17px;
line-height:18px;
text-align:right;
background-color: #FFFFFF;
color:#3399CC;
font-family:Century Gothic;
text-decoration: none;
}
You can also add multiple headers.
---------------------------------------------------------------------------------------------------------------------------
This is all we include in the styles.
so with all the information I have given you far this is an example of the sort of style you can create.
<style>
p, td
{font-family: Century Gothic;
font-size: 11px;
font-weight: 500;
color: #333333;
text-decoration: none;}
a:link,
{font-family: Century Gothic;
font-size: 10px;
color: #0066CC;
letter-spacing: 1px;}
a:hover
{font-family: Century Gothic;
font-size: 10px;
text-decoration: underline;
color: #333333;
letter-spacing: 1px;}
b
{font-size: 12px;
text-decoration: bold;
margin: 0px;
font-weight: 650;
color: #0066CC;
text-align: left;}
i
{color: #333333; h1
{
font-size:19px;
line-height:18px;
text-align:right;
background-color: #FFFFFF;
border-bottom: 1px dotted #333333;
color:#3399CC;
font-family:Century Gothic;
text-decoration: none
font-style: italic;}
u
{text-decoration: underlined;
color: #000000;
font-size: 11px;
}
;}
</style>
---------------------------------------------------------------------------------------------------------------------------
Now for the actual coding.
Firstly the banner.
You want it in the center
so...
<center>
<img src=URL here
>
</center>
---------------------------------------------------------------------------------------------------------------------------
OKay so now for the table bit.
This is where it gets complicated
For each box you need to code many different things about it.
<Table>
<Td Background=http://i41.tinypic.com/2mm9v0o.jpg
>
<Div Style=overflow:auto;width:520px;height:130px;border-width:1px;border-style:solid;border-color:FFFFFF;>
<h1>HEADER TEXT GOES HERE</h1>
TEXT GOES HERE
</Div></TD>
This is the code for just one long box.
For each new line of boxes you need the <table> to format the boxes as a table.
Then you need the background image of the box.
<td background=
>
Then you need the style of the box,( how it looks)
you need to include the size, and border information.
you also have to include a code that affects the overflow of text,
you can see how I have done it above.
after this you need to add the text,
firstly the header.
then the normal text.
to make the header text like you have set it you have to include the style tag <h1>TEXT</h1>
then you can do your normal text.
to close the box you then do
</div> </td>
---------------------------------------------------------------------------------------------------------------------------
For two boxes on a line it will look like this:
the (Bracketed words) are just helpful notes to point things out for you not included in code.
<Table>
<Td Align=Left>
<Td Background=http://i41.tinypic.com/2mm9v0o.jpg
>
<Div Style=overflow:auto;width:255px;height:150px;border-width:1px;border-style:solid;border-color:FFFFFF;>
<h1>Header</h1>
Text
</Div></Td>
(as you see for another box include no table code, you only need it for the first box on the line)
<Td Align=Right>
<Td Background= http://i41.tinypic.com/2mm9v0o.jpg
>
<Div Style=overflow:auto;width:255px;height:150px;border-width:1px;border-style:solid;border-color:FFFFFF;>
<h1>Header</h1>
Text
</Div></Td>
</Div></Td></Table>
(for the last box on the line, if there are multiple boxes, you need to include this extra coding)
---------------------------------------------------------------------------------------------------------------------------
Try altering all the box information and styles for your own sort of layout
if there are any questions just look them up on the internet you will find out how to
[br]I joined marapets: August 12, 2006, 12:35 am [br]
