5 replies to this topic

[excel30]

Ive only just started looking at CSS so please beat with me.

How do I change the font size of text that is not within a paragraph?


This stylesheet example only changes text in parapgraph.
p{
font-size: xx-small;
font-family: Arial,sans-serif;
color: #000000;
}



This stylesheet doesnt change the font size
body{
font-size: xx-small;
font-family: Arial,sans-serif;
color: #000000;
}

So what do I need to change the font size of text not within a paragraph?
Ideally Im looking for a font size 2 equivilent.

Thanks in advance.

[cfreek]

This may not be the best method, but I usually prefer to start my stylesheet with:
*, td
{
font-size: ##;
font-family: Verdana;
}

That way everything looks the way I want, and then I style other HTML elements, spans, divs, etc as needed.

Added:
*, td - td is added because some styles do not want to work on a td with just * used

[maleman]

"So what do I need to change the font size of text not within a paragraph?
Ideally Im looking for a font size 2 equivilent."

You could use "inline style" as such:

<span style="font-size: medium;">Johnny was a very good boy.</span>

or in your stylesheet, add another class:

.bigger { font-size: medium; }

<span class="bigger">Johnny was a very good boy.</span>

You could also change the body block and all text on the page that isn't set to some other font-size will be set to the body font-size.

body{
font-size: some-other-size;
font-family: Arial,sans-serif;
color: #000000;
}


I use px for font-size. It's more uniform across-the-board with different browsers. Consider using px instead of other formats.

Good Luck!

Edited by maleman, 17 June 2007 - 09:12 PM.

[Clintorius]

Try

[codebox]
body,p,td,div,h1,h2,h3,li,a {
font-size: some-size;
font-family: Arial,sans-serif;
color: #000000;
}
[/codebox]

A bit rude - but there you go.

BTW relative font size is OK - it keeps your pages accessible and expandable. However if your layout is rigid you may have to use absolute pixel values but dont make it a rule. Use it with reason. You can compensate for the difference in font size between platforms when using relative font size with a simple hack.

C.

[Conspicuous]

You could use "inline style" as such:

<span style="font-size: medium;">Johnny was a very good boy.</span>

I have to respectfully disagree with this. Yes you could functionally do it like that, but creating inline styles negates the benefits of using CSS in the first place. If you need to change a style you don't want to have to hunt through all your pages to find those pesky inline styles.

or in your stylesheet, add another class:

.bigger { font-size: medium; }

<span class="bigger">Johnny was a very good boy.</span>

This is a much better way to go and preserves all your flexibility to change your stylesheet in the future.

[piskie]

CODE

*, td
{
font-size: ##;
font-family: Verdana;
}
p {
font-size: x.xem;

I haven't tried it, but see how this goes.