HOME | DD
x-Danielle-x — CSS Tutorial Part 1
Published: 2009-07-10 02:40:13 +0000 UTC; Views: 10677; Favourites: 486; Downloads: 739
Redirect to original
Description
A tutorial that teaches basic css coding. If you want a copy of the basic css code, just click download.Here is the second part of the tutorial!: [link]
The journal reference one is here this is a visual of how the code affects specific parts of your journal:
[link]
Related content
Comments: 73
yeah i am learning journal css. i am getting tired of the boring old green lol
👍: 0 ⏩: 1
I'm a noob at it also. XD
👍: 0 ⏩: 0
I feel like a fecking noob for not understandng even the slightest thing of this D:
👍: 0 ⏩: 0
so quick question...
i have no idea how to do coding and was wanting a journal thats made up of different shades of blue.
i also want this image [link] at the very top.... like above where the journal title would be, you know?
ive seen some people do it but i just cant seem to figure out how...
and help/codes or parts of the codes would help greatly, as im very confused! D:
👍: 0 ⏩: 0
Wow! This is really helpful. I knew some of the basic coding, but now this really clears it up! Um, just a few questions though.
I noticed that for border-width and font-size that you have Xpx and xxpx- that would be 3px right or 4px depending on if you want a larger border,and for the font you would put 8px or 12px correct? Just want to make sure so I don't screw it up.
Also, for the journal top, for the background image that you choose to use, you have a height: xxxpx? I'm not entirely sure what I would put there.
So, those are my questions and thanks for making such a great tutorial that is simple and easy to understand!
👍: 0 ⏩: 1
Your right about the border and font sizes
About the background image, you put the height of the image there I just put "xxxpx" as an example I should have made that more clear sorry >>
And I'm glad my tutorial helped you out
👍: 0 ⏩: 1
=] what would you recommend as a good height for a background image?
👍: 0 ⏩: 0
Hey, um, do you know how to get rid of the little line in between the two links at the bottom?
👍: 0 ⏩: 0
I have a few questions...
I want to put a image that comes over the text, and over the journal per se, how do I do that?
And what if I use a gradient as a background, how do I have to put it?
amaizing job, thank you so much
👍: 0 ⏩: 0
How would I personalize my journal? Like, put some pictuers in the background?
👍: 0 ⏩: 1
If you want an image to show up in the journal's background use this code:
journalbox.journaltext{
background-image: url(put the url for the image here);
background-repeat: put repeat or no-repeat here;
background-position: put right, left or center here;
}
If you need anymore help just ask
👍: 0 ⏩: 1
Oh, thank you so much for replying! ...But...It wont work...could you just type that same thing up there with these options?
Heres the picture: [link]
Center
And no repeat.
Thanks SO much!
👍: 0 ⏩: 1
.journalbox .journaltext{
background-image:url([link] );
background-repeat:no-repeat;
background-position:center;
}
This should work
👍: 0 ⏩: 3
I can't get my image to show up, either! ;A; Can you please help?
Here's the image I want-
[link]
👍: 0 ⏩: 0
I tried getting rid of the other background but that didnt help.
👍: 0 ⏩: 1
If you have another image, you will probably have to put the two images together as the header image. Thats probably why it won't work, I don't think you can put two different images on.
👍: 0 ⏩: 1
Heres my CSS:
body {
background-color:transparent;
background-image:url('[link] 
background-repeat:repeat;
}
.journalbox {
border-width:0px;
background-color:transparent;
}
.journalbox .list li {
background-color:transparent;
text-align:center;
color:#ffffff;
}
.journalbox .list li.a {
background-color:transparent;
text-align:center;
color:#ffffff;
}
.journalbox a {
color:#ffffff;
}
.journalbox a:hover {
color:#c1e1ff;
}
.journalbox .journaltop img {
display: none;
}
.journalbox .journaltop {
background-image: url([link] );
width: 1000px;
height: 189px;
}
.right {
}
.journaltop {
color: #ffffff;
padding: 100px 0px 0px 180px;
}
.journaltop h2 {
font-size: 35px;
margin-left:-45px;
color: #ffffff;
}
And this is my header.
Could you make it so that the pictures behind the text?
👍: 0 ⏩: 0
...Nope, when I click preview it just looks the same. Should I get rid of the other background I have?
👍: 0 ⏩: 0
brilliant, simple, and eay to understand
👍: 0 ⏩: 0
thank you very much for this!!it is really usefull!!
👍: 0 ⏩: 0
<= Prev |