Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

apply style to words within paragraphs 2

Status
Not open for further replies.

1DMF

Programmer
Jan 18, 2005
8,795
GB
Hi,

I'm a little confused how you change the style of words within a paragraph / sentence.

<u>,<i> etc.. are deprecated and I can accept that, so what do you use to surround a word to then apply a class/css styling to.

I've used <span class="myclass">text</span>

Is this the correct way to do it?

Thanks 1DMF.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.
 
Yes, that is what the <span> tag is intended for. It is also the way I style words/phrases w/in a paragraph when <strong> or <em> are not applicable.

-kaht

Looking for a puppy? [small](Silky Terriers are hypoallergenic dogs that make great indoor pets due to their lack of shedding and small size)[/small]
 
thanks kaht, however you have thrown a <span>ner in the works ;-)

the class I am using i've called 'emphasise' with the following attributes
Code:
.emphasise {
    font-style:italic;
    font-weight:bold;
    font-size:80%;
}

so this raises the question should I be using <em> ? seings as it is the emphasis tag, only I find it also changes the pitch of the text, which is why I beleive we all use it to put those 'required field' stars on a form!

is my way still OK ?

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.
 
If you're styling words that specifically need to be "emphasized", then it would be correct to use the <em> tag and then style it to your needs. That is the intended use for the <em> tag.

-kaht

Looking for a puppy? [small](Silky Terriers are hypoallergenic dogs that make great indoor pets due to their lack of shedding and small size)[/small]
 
told you, you threw a <span>ner in the works - lol

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.
 
BTW <i> is not a deprecated tag

For accessibilty reasons you should be using the HTML elements to bold and emphasise words/phrases. Some screen readers can give the appropriate inflections to the words when markup tags <i>, <b>, <em>, <strong> are used to surround them. If you simply style the words to appear the same visually, they will be simply read out in exactly the same way as the surrounding words.

There is also the consideration of search engines may give a little more weighting to words/phrases that are emphasised or bolded.



Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.
People Counting Systems

So long, and thanks for all the fish.
 
Hey, I read that page last week too!!

[small]"I see pretty girls everywhere I look, everywhere I look, everywhere I look. - Band song on movie "The Ringer"[/small]
<.
 
hmmm if <b>, <i> etc aren't deprecated why is <u> , it makes no sense.

also you are saying that instead of using CSS if i want to bold, italic (possibly underline) I should use tags to apply styling when tags to todays standards are for content only.

I understand what your saying about screen readers (i'm still unsure what these are or who uses them) so will have to concider my target audience as not using such a device.

Standards, Semantics and Usability sometime seem to blur and contradict each other.

I guess for what I am doing the change I made from <span> to <em> will suffice.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.
 
Standards, Semantics and Usability sometime seem to blur and contradict each other
Nope, maybe your interpretation of it does though.

WRT to HTML;
Standards is about adhering to the rules as defined by the W3c

Semantics is about using the elements appropriate to the task at hand.
The semantic meaning of "semantic" is "having to do with meaning". So by employing "Semantic markup" you are demonstrating the meaning of the text by using the appropriate tools.

Usability is ensuring that all users of the pages can access them in a way that is appropriate to their needs.

If blind they can use a screen reader (A user agent that "speaks" the text on the page).
If partially sighted they can adjust the size of the text.
If colour blind they can change the contrast or the colour scheme of their browser/computer and your page allows for it.
if they have a disability or illness that restricts hand/wrist movement they can navigate by means other than a mouse.
So as you can see the three elements can and should work in conjuction.

(i'm still unsure what these are or who uses them) so will have to concider my target audience as not using such a device.
Not the best way of thinking. You should consider "What if some of my target audience are using a [insert device]"
One of the prime considerations for any market place is to know your customers and their requirements.

On the <b>, <i> & <u> points, <u> has no meaning for the document structure other than that of a visual indicator, the same as it is with <s> & <strike> (strike-through) and also <font>.


Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.
People Counting Systems

So long, and thanks for all the fish.
 
so bold and italic are not visual indicators they can affect meaning or context and considered as such content, like fullstops or commas.

Is that what you are saying?

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you.
 
Yep, or rather not just visual indicators. (as I used bold there to emphasise "just")

When we speak to others, we "bold" and emphasise words by changing the inflections applied to them. In written form to do the same we have to apply markup. As humans we would understand the visual indicators that CSS will show, non-visual user agents do not.


Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.
People Counting Systems

So long, and thanks for all the fish.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top