| View previous topic :: View next topic |
| Author |
Message |
adatti
MyGen Mod
Posts: 1120
Location: West Palm Beach,FL
|
 Posted: Saturday 25th March 4:05pm Post subject: CSS for Beginners |
 |
|
These are some basic codes for a CSS beginner.
Set a Background Color:
| Code: | <style type="text/css">
body { background-color: input color name; }
</style> |
Set image as a background:
| Code: | <style type="text/css">
body
{
background-image: url('input image url');
}
</style> |
Repeat Background Image Vertically:
| Code: | <style type="text/css">
body
{
background-image: url('input image url');
background-repeat: repeat-y;
}
</style> |
Place a background image:
| Code: | <style type="text/css">
body
{
background-image: url('image url');
background-repeat: no-repeat;
background-position: the position u want;
}
</style> |
Change Font Type:
| Code: | <style type="text/css">
p { font-family: the font name; }
</style> |
_________________
Last edited by adatti on Sunday 26th March 2:39pm; edited 1 time in total |
|
| Back to top |
|
Triple
Posts: 38
Location: Illinois
|
| Posted: Saturday 25th March 7:55pm Post subject: |
|
|
Just a little note to you beginners, do not use
| Code: | <style>
code here
</style>
|
For every little thing. You can put everything between one set of style codes...if that made sence....
I jsut see people with a million little <style></style> things  .
_________________
 |
|
| Back to top |
|
diamondandy
MyGen Mod Post Whore
Posts: 3787
Location: Liverpool, England
|
| Posted: Saturday 25th March 8:18pm Post subject: |
|
|
what triple is saying is... instead of having..
| Code: | <style type="text/css">
p {font-family: the font name}
</style>
<style type="text/css">
body {background-color: input color name}
</style> |
u can combine them so it looks like..
| Code: | <style type="text/css">
body {background-color: input color name}
p {font-family: the font name}
</style> |
and it will have the same effect 
_________________
| Kyle m wrote: | | diamondandy. LITERALLY in a class of his own now! |
Div Part 1 Vid In Tutorial Section |
|
| Back to top |
|
adatti
MyGen Mod
Posts: 1120
Location: West Palm Beach,FL
|
| Posted: Sunday 26th March 12:57pm Post subject: |
|
|
yea wht andy and triple said.
_________________
|
|
| Back to top |
|
Triple
Posts: 38
Location: Illinois
|
| Posted: Friday 31st March 5:55pm Post subject: |
|
|
ROFL
Thanks for that one Andy...lil bit lazy 
_________________
|
|
| Back to top |
|
luv2dostuf
Posts: 1087
Location: Utah
|
| Posted: Friday 31st March 8:10pm Post subject: |
|
|
Also, for people who are reading the page source to help people find out problems and mistakes with their code, its a hell of a lot easier to read this:
| Code: | <style>
table, tr, td, li, p, div { color:FFFFFF; font-size:12px; }
.btext { color:FFFFFF; font-size:12px; }
.blacktext10 { color:FFFFFF; font-size:12px; }
.blacktext12 { color:FFFFFF; font-size:12px; }
.lightbluetext8 { color:FFFFFF; font-size:12px; }
.orangetext15 { color:FFFFFF; font-size:12px; }
.redtext { color:FFFFFF; font-size:12px; }
.redbtext { color:FFFFFF; font-size:12px; }
.text { color:FFFFFF; font-size:12px; }
.whitetext12 { color:FFFFFF; font-size:12px; }
a:active, a:visited, a:link { color:FFFFFF; font-size:12px; }
a:hover { color:FFFFFF; font-size:12px; }
a.navbar:active, a.navbar:visited, a.navbar:link { color:FFFFFF; font-size:12px; }
a.navbar:hover { color:FFFFFF; font-size:12px; }
a.redlink:active, a.redlink:visited, a.redlink:link { color:FFFFFF; font-size:12px; }
a.redlink:hover { color:FFFFFF; font-size:12px; }
.nametext { color:FFFFFF; font-size:12px; }
</style> |
Then this:
| Code: | | <style> table, tr, td, li, p, div {color:FFFFFF; font-size:12px;} .btext {color:FFFFFF; font-size:12px;} .blacktext10 {color:FFFFFF; font-size:12px;} .blacktext12 {color:FFFFFF; font-size:12px;} .lightbluetext8 {color:FFFFFF; font-size:12px;} .orangetext15 {color:FFFFFF; font-size:12px;} .redtext {color:FFFFFF; font-size:12px;} .redbtext {color:FFFFFF; font-size:12px;} .text {color:FFFFFF; font-size:12px;} .whitetext12 {color:FFFFFF; font-size:12px;} a:active, a:visited, a:link {color:FFFFFF; font-size:12px;} a:hover {color:FFFFFF; font-size:12px;} a.navbar:active, a.navbar:visited, a.navbar:link {color:FFFFFF; font-size:12px;} a.navbar:hover {color:FFFFFF; font-size:12px;} a.redlink:active, a.redlink:visited, a.redlink:link {color:FFFFFF; font-size:12px;} a.redlink:hover {color:FFFFFF; font-size:12px;} .nametext {color:FFFFFF; font-size:12px;}</style> |
|
|
| Back to top |
|
diamondandy
MyGen Mod Post Whore
Posts: 3787
Location: Liverpool, England
|
| Posted: Saturday 01st April 3:23pm Post subject: |
|
|
i also find that if u want to find the source on someone's page, you should click on View > Find (i think it's view anyways) and type in
.blacktext
or something similar and it will take u too the profile's CSS style so u can copy wot u need
_________________
| Kyle m wrote: | | diamondandy. LITERALLY in a class of his own now! |
Div Part 1 Vid In Tutorial Section |
|
| Back to top |
|
luv2dostuf
Posts: 1087
Location: Utah
|
| Posted: Saturday 01st April 10:15pm Post subject: |
|
|
cool beans... never thought of that  |
|
| Back to top |
|
M!$$_N3W_B3AUTY!
Posts: 5
Location: BAKERSFIELD
|
| Posted: Sunday 02nd April 2:23am Post subject: |
|
|
| i dont get wat diamond watever said. |
|
| Back to top |
|
diamondandy
MyGen Mod Post Whore
Posts: 3787
Location: Liverpool, England
|
| Posted: Sunday 02nd April 10:55am Post subject: |
|
|
on the pic click on view source...
as i can see the mygen logo in the corner i just typed in to find .mygen and it found the CSS part for me to copy wot i want =)
_________________
| Kyle m wrote: | | diamondandy. LITERALLY in a class of his own now! |
Div Part 1 Vid In Tutorial Section |
|
| Back to top |
|
blood_secrets
Posts: 557
|
| Posted: Thursday 11th May 2:28pm Post subject: hehe |
|
|
or you could just right click and click view source : )
i do that normally, but i dind't know note pad had that neat trick to find certain words, that helps : )
thankies
x
_________________
 |
|
| Back to top |
|
Kyle m
Posts: 2514
|
| Posted: Thursday 11th May 2:46pm Post subject: Re: hehe |
|
|
| blood_secrets wrote: | | or you could just right click and click view source : ) |
that is what andy said to do.
_________________
I AM NOT A MOD |
|
| Back to top |
|
scooton
Posts: 1590
|
| Posted: Sunday 25th June 5:52pm Post subject: Re: hehe |
|
|
| blood_secrets wrote: | or you could just right click and click view source : )
i do that normally, but i dind't know note pad had that neat trick to find certain words, that helps : )
thankies
x |
in firefox you can just use ctrl+f when using view source |
|
| Back to top |
|
Temari15
Posts: 1
|
| Posted: Friday 30th June 8:07am Post subject: |
|
|
| diamondandy wrote: |
on the pic click on view source...
as i can see the mygen logo in the corner i just typed in to find .mygen and it found the CSS part for me to copy wot i want =) |
what program did you use ? |
|
| Back to top |
|
adatti
MyGen Mod
Posts: 1120
Location: West Palm Beach,FL
|
| Posted: Friday 30th June 11:06am Post subject: |
|
|
there is no program. jst presst ctrl + u on ur browser.
_________________
|
|
| Back to top |
|
|
