Prev: Inline css tags: need to add link color and hover over behavior
Next: CSS Table
From: prt7u on 22 Mar 2007 08:32
Howdy,

I'm new to CSS and have a basic question. What is the best way to
italicize a word or words using CSS versus the <em> </em> tags that
used to be used in HTML?

Or am I jumping the gun and assuming that there is a better way with
CSS versus the HTML tags?

Does it make sense to do them "inline" or set up a class or some other
such thing and then reference that to make it do what I want?

Thanks in advance for the help and the patience,

Pete

From: Els on 22 Mar 2007 09:09
prt7u wrote:

> Howdy,
>
> I'm new to CSS and have a basic question. What is the best way to
> italicize a word or words using CSS versus the <em> </em> tags that
> used to be used in HTML?
>
> Or am I jumping the gun and assuming that there is a better way with
> CSS versus the HTML tags?
>
> Does it make sense to do them "inline" or set up a class or some other
> such thing and then reference that to make it do what I want?

It depends on the reason to italicize the text. If the reason is that
you want to emphasize it, use <em></em>. If it's a 'strong' word ;-),
use <strong></strong>. If it is just random decoration for no
particular reason, use <i></i>. If it's just decoration and you may
want it italic now, but bold red in the future, use <span
class="foo"></span>, where foo should be something that tells you
what's so special about that particular text that you want it italic
now, but maybe bold red on another day.

Each of these elements can be styled through CSS, so even if you do
decide to use <i></i>, you can still change it later:
i{font-style:normal;font-color:red;font-weight:bold;}

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/
From: Andreas Prilop on 22 Mar 2007 11:06
On Thu, 22 Mar 2007, prt7u wrote:

> What is the best way to italicize a word or words

<i>word or words</i>

> using CSS

i { font-style: italic } /* redundant */

> versus the <em> </em> tags that used to be used in HTML?

<em> is emphasis, not italics - and it's still "used",
not "used to be used", for this purpose.

--
In memoriam Alan J. Flavell
http://groups.google.com/groups/search?q=author:Alan.J.Flavell
From: Jukka K. Korpela on 22 Mar 2007 13:43
Scripsit Els:

> It depends on the reason to italicize the text. If the reason is that
> you want to emphasize it, use <em></em>. If it's a 'strong' word ;-),
> use <strong></strong>. If it is just random decoration for no
> particular reason, use <i></i>. If it's just decoration and you may
> want it italic now, but bold red in the future, use <span
> class="foo"></span>, where foo should be something that tells you
> what's so special about that particular text that you want it italic
> now, but maybe bold red on another day.

For completeness - though this is a markup matter rather than CSS - I might
add that you can use <cite> for a book title or something similar and <var>
for a placeholder or variable. IE also displays <address> in italics by
default, which is just foolish in most situations; fix it with address {
font-style: normal } if you use <address>.

All of these methods actually produce either italics or oblique, depending
on font. Although CSS distinguishes between font-style: italic and
font-style: oblique, browsers don't. Whichever method you use, you get
either real italics (italic font style as designed by a typographer) or
oblique, i.e. algorithmically slanted text. You get the latter if the font
has no italic version (available on the user's computer). It gives poor
typographic quality in general, but for some special characters it's really
awful. If you have Arial Unicode MS on your system (you probably have it if
you have MS Office software), testing
<div style="font-family: Arial Unicode MS; font-style:
italic">Hello|\world!</div
is illustrating.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

 | 
Pages: 1
Prev: Inline css tags: need to add link color and hover over behavior
Next: CSS Table