CODEWITHSUNDEEP
htmlcss
Isis
Isis

Reputation: 4666

HTML/CSS font color vs span style

What should I use?

<span style="color:red">test</span>

or

<font color="red">test</font>

and why?

Upvotes: 71

Views: 429916

Answers (7)

Amar Pratap
Amar Pratap

Reputation: 1018

<span style="color:#ffffff; font-size:18px; line-height:35px; font-family: Calibri;">Our Activities </span>

This works for me well:) As it has been already mentioned above "The font tag has been deprecated, at least in XHTML. It always safe to use span tag. font may not give you desire results, at least in my case it didn't.

Upvotes: 6

fncomp
fncomp

Reputation: 6198

Use style. The font tag is deprecated (W3C Wiki).

Upvotes: 9

Cody Gray
Cody Gray

Reputation: 244951

The <font> tag has been deprecated, at least in XHTML. That means that it's use is officially "frowned upon," and there is no guarantee that future browsers will continue to display the text as you intended.

You have to use CSS. Go with the <span> tag, or a separate style sheet. According to its specification, the <span> tag has no semantic meaning and just allows you to change the style of a particular region.

Upvotes: 6

Damien
Damien

Reputation: 1217

Actually I would say the 1st preference would be an external style sheet (External CSS), the 2nd preference would be writing CSS in style tags in the header section of the current page (Internal CSS)

<style type="text/css">
<!-- CSS goes here -->
</style>

And as a 3rd option - or last resort rather - I'd use CSS in the tags themselves (Inline CSS).

Upvotes: 4

Peter
Peter

Reputation: 3008

Neither. You should separate content and presentation, giving your HTML code logical codes. Think of it this way; to a blind person, or on a browser that cannot display colors, what is left of your code? Why do you want it to be red?

Most probably, your decision to make text red is because you want to give it emphasis. So your HTML code should be:

<em>test</em>

This way, even non-visual browsers can make sure they give the text emphasis in one way or another.

Next step is to make the text red. But you don't want to add the color code everywhere, much more efficient to just add it once:

<style>
  em { color: red; }
</style>

This way, all emphasized code on your website becomes red, making it more constant.

Upvotes: 32

Michael
Michael

Reputation: 4326

1st preference external style sheet.

<span class="myClass">test</span>

css

.myClass
{
color:red;
}

2nd preference inline style

<span style="color:red">test</span>

<font> as mentioned is deprecated.

Upvotes: 18

Kyle
Kyle

Reputation: 67234

You should use <span>, because as specified by the spec, <font> has been deprecated and probably won't display as you intend.

Upvotes: 69

Related Questions