Welcome Guest ( Log In | Register)



 
 Reply to this topicStart new topic
> Question About Css, Setting the style of titles.
mrdee
post Feb 10 2008, 05:43 PM
Post #1


Super Member
*********

Group: [HOSTED]
Posts: 258
Joined: 18-July 07
From: Slough (UK)
Member No.: 46,682
Hello,
I would like to ask a question about setting a style for titles on my web site.
So far I have managed to set my titles with a different capital by doing this:

CODE
h1.title:first-letter {color: gold; font-size=xx-large; font-style: oblique; background: black};

Then my titles come out with a big golden italic capital in a black box, and I get there by doing
CODE
<h1 class="title">Blablablablabla</h1>

However, if I also want a certain background for the rest of my title, eg. a golden background or even a background image, how do I set that in the same "h1.title" setting?
The setting h1.title:first-letter only seems to affect the first letter.
Also, I want this to only affect my headers for titles, not just any header (h1).
Is there anyone who can help me out here?
Thanks in advance.

(list)

Go to the top of the page
 
+Quote Post
truefusion
post Feb 10 2008, 05:58 PM
Post #2


Ephesians 6:10-17
Group Icon

Group: [MODERATOR]
Posts: 1,861
Joined: 22-June 05
From: The World of Gentoo
Member No.: 8,528
T17 GFX Crew
Remove :first-letter and modify a bit:
CODE
h1.title {
background: gold;
}

For background image:
CODE
h1.title {
background-image: url(path_to_image.ext);
}

Do note, however, that the golden background may cause some visual issues with the first letter of the H1 element with the title class.

(list)

Go to the top of the page
 
+Quote Post
mrdee
post Feb 10 2008, 06:05 PM
Post #3


Super Member
*********

Group: [HOSTED]
Posts: 258
Joined: 18-July 07
From: Slough (UK)
Member No.: 46,682
QUOTE(truefusion @ Feb 10 2008, 05:58 PM) *
Remove :first-letter and modify a bit:
CODE
h1.title {
background: gold;
}

For background image:
CODE
h1.title {
background-image: url(path_to_image.ext);
}

Do note, however, that the golden background may cause some visual issues with the first letter of the H1 element with the title class.

Thank you for your reply, truefusion.
However, doing it your way removes the special capital at the beginning of the title, which is exactly what I would like to keep.

(list)

Go to the top of the page
 
+Quote Post
rvalkass
post Feb 10 2008, 06:53 PM
Post #4


apt-get moo
Group Icon

Group: [MODERATOR]
Posts: 2,052
Joined: 28-May 05
From: Hertfordshire, England
Member No.: 7,593
Spam Patrol
If I understand what you want, you just need two declarations to get it done.

CODE
/* Applies to all the other letters */
h1.title {
color: #0000FF;
font-size:0.1em;
background-color: #FF00FF;
};

/* Applies only to the first letter */
h1.title:first-letter {
color: gold;
font-size=xx-large;
font-style: oblique;
background: black
};


I see no reason why it can't be done that way.

(list)

Go to the top of the page
 
+Quote Post
kobra500
post Feb 10 2008, 07:01 PM
Post #5


Super Member
*********

Group: [HOSTED]
Posts: 395
Joined: 8-January 08
From: UK - Kent
Member No.: 55,950
Yes it shoudl work like that because the specific letter will overright the specifications set in the previous statement!

(list)

Go to the top of the page
 
+Quote Post
mrdee
post Feb 10 2008, 08:39 PM
Post #6


Super Member
*********

Group: [HOSTED]
Posts: 258
Joined: 18-July 07
From: Slough (UK)
Member No.: 46,682
Thanks for your help.
That did the trick.

(list)

Go to the top of the page
 
+Quote Post
« Next Oldest · CSS (Cascading Style Sheets) · Next Newest »
 

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Free: Css - Style Sheet Editors And(7)
  2. Need Help On "global News" Problem.(7)
  3. Style Not Displayed Correctly On Firefox [resolved](16)


 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 24th July 2008 - 12:36 PM
Powered By IP.Board © 2008  IPS, Inc.
Licensed to: Xisto Corporation