Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Re: Can I have b - for bold make in css in certain color?

Reply
Thread Tools

Re: Can I have b - for bold make in css in certain color?

 
 
Jonathan N. Little
Guest
Posts: n/a
 
      10-02-2012
MrBean wrote:
> Tried
>
> b {color: red;}


Yes that is correct to make "B" elements red, unless no rule with more
specificity overrules it.

>
> also
>
> .b {color: red;}
>
> Anything will work!?


No that means "elements of class 'b'" not the "B" element. How about a
URL to the the page in question. Obviously you are doing something else
wrong that you are not showing in your snippets.


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
 
 
 
Jukka K. Korpela
Guest
Posts: n/a
 
      10-02-2012
2012-10-02 17:25, MrBean wrote:

> That <b> element is also a link.


No it isn't - can't be. Consider learning some HTML before proceeding.

> So it takes a color from this.
>
> a:link {color: #DDD; text-decoration: none;}


No it does not. Consider learning some CSS before proceeding.

> So I want to have that link <b> in red or yellow.


Stop wanting that. Consider learning some web design before proceeding.

> That link would be a
> marking the page we are on.


One of the things you'll learn in Elementary Web Design is that you
should not have a link that points to the page itself.

> <td class="rozdzial">
>
> |<a href="1.html" title="Rozdział 1">1</a>|<a href="2.html"
> title="Rozdział 2">2</a>|<a href="3.html" title="Rozdział 3">3</a>|<a
> href="4.html" title="Rozdział 4">4</a>|<a href="5.html" title="Rozdział
> 5">5</a>|<a href="6.html" title="Rozdział 6">6</a>|<a href="7.html"
> title="Rozdział 7">7</a>|<a href="8.html" title="Rozdział 8">8</a>|<a
> href="9.html" title="Rozdział 9">9</a>|<b><a href="*10.html*"
> title="Rozdział 10">10</a></b>
>
> </td>


Drop the href attribute from the <a> element that contains the current
page number. Drop the <b> markup.

Then the number 10 will appear in normal text style, whereas the links
appear with link colors and underline. This is distinctive enough.

After Elementary Web Design, take Advanced Web Design, and you'll learn
how to play with link colors etc. making things somewhat better, not worse.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
 
 
 
Jonathan N. Little
Guest
Posts: n/a
 
      10-02-2012
MrBean wrote:
> On 2/10/2012 10:25 PM, MrBean wrote:
>> On 2/10/2012 8:57 PM, Jonathan N. Little wrote:
>>> MrBean wrote:
>>>> Tried
>>>>
>>>> b {color: red;}
>>>
>>> Yes that is correct to make "B" elements red, unless no rule with more
>>> specificity overrules it.
>>>
>>>>
>>>> also
>>>>
>>>> .b {color: red;}
>>>>
>>>> Anything will work!?
>>>
>>> No that means "elements of class 'b'" not the "B" element. How about a
>>> URL to the the page in question. Obviously you are doing something else
>>> wrong that you are not showing in your snippets.

>>
>>
>> You are correct.
>>
>> That <b> element is also a link.
>>
>> So it takes a color from this.
>>
>> a:link {color: #DDD; text-decoration: none;}
>> a:visited {color: #DDD; text-decoration: none;}
>> a:hover {color: #F60; text-decoration: none; }
>>
>>
>> So I want to have that link <b> in red or yellow. That link would be a
>> marking the page we are on.
>>
>> <td class="rozdzial">
>>
>> |<a href="1.html" title="Rozdział 1">1</a>|<a href="2.html"
>> title="Rozdział 2">2</a>|<a href="3.html" title="Rozdział 3">3</a>|<a
>> href="4.html" title="Rozdział 4">4</a>|<a href="5.html" title="Rozdział
>> 5">5</a>|<a href="6.html" title="Rozdział 6">6</a>|<a href="7.html"
>> title="Rozdział 7">7</a>|<a href="8.html" title="Rozdział 8">8</a>|<a
>> href="9.html" title="Rozdział 9">9</a>|<b><a href="*10.html*"
>> title="Rozdział 10">10</a></b>
>>
>> </td>
>>
>> Any suggestion how to achieve that?
>>
>> TIA

>
>
> It's not on a web as yet!


Lame excuse, put a temp demo page. Because you may not have included
something important. If you don't know what is wrong how would you know
what to include?

Anyway using what you have given me pseudo-classes for A element are
"specificity" is more than the base "B" element selector. Learn about
specificity and how the cascade works:

<www.w3.org/TR/CSS2/cascade.html#specificity>

To to increase the specificity for your rule I would use a descendant
selector rule:

b a { color: red; }

or:

b a:link, b a:visited { color: red; }
b a:hover { color: maroon; }

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      10-02-2012
2012-10-02 19:20, Jonathan N. Little wrote:

>>>>> b {color: red;}

[...]
> Anyway using what you have given me pseudo-classes for A element are
> "specificity" is more than the base "B" element selector.


No, this is not about specificity at all.

> Learn about specificity and how the cascade works:


There are probably less than three people in the world who really
understand it. But there are of course very different levels of ignorance.

> To to increase the specificity for your rule I would use a descendant
> selector rule:
>
> b a { color: red; }


This would set the color of certain <a> elements, and *that* is the
point, not specificity. The point is that b {color: red;} sets the color
of <b> elements, not any nested elements. If nested elements *inherit*
the color, that’s completely distinct from *specificity*. And <a>
elements with href do not inherit a color at all, since they have (as a
matter of reality, not as required by specs) color set on them in
browser style sheets.

The rule above would make *all* <a> elements nested inside <b> elements
red, unless overridden by other rules.

> b a:link, b a:visited { color: red; }


This would set the color as above but only if the <a> element has the
href value. It does not pay any attention to the specific attribute value.

And all this, when completed, would be worse than useless, since it
would break the vital distinction between visited and unvisited links
*and* it would set their color to red, which is generally a poor choice
and not associated intuitively with links (except perhaps in their
activated state).

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      10-02-2012
Jukka K. Korpela wrote:
> 2012-10-02 19:20, Jonathan N. Little wrote:
>
>>>>>> b {color: red;}

> [...]
>> Anyway using what you have given me pseudo-classes for A element are
>> "specificity" is more than the base "B" element selector.

>
> No, this is not about specificity at all.
>


Upon reexamination you are correct. Just direct association of a rule to
an element. Of course he could have easily gotten what he wished

<a href="some_url"><b>text</b></a>


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      10-03-2012
2012-10-03 13:07, MrBean wrote:

> http://www.zbawienie.com/biblia/Wj/1.html
>
> In the header is list of chapters and they are links.


Barely readable. There should be a more suitable font and more spacing,
and the vertical bars disturb rather than help. And dark blue background
is really bad for links, since it prevents from using reasonable link
colors.

> I would like to
> have the page I'm on in that list in different color - if possible.


You should remove the href attribute first. That number should not be a
link at all. Then you can handle the styling using different selectors.

> I have done some more work and I would be reluctant to re work the top
> menu, because it would be a lot of work editing a every single page.


Then your technologies are quite unsuitable for work like this. If you
need to edit each page separately, you will not make any corrections or
improvement later - it’s a nightmare in maintenance.

> I thought it could be easy as b {color: #555;} but evidently I was wrong.


Clearly, because that rule only sets the color of <b> elements, as
explained.

> Are you nuts? You will go and study German to copy few sentences from
> the WEB?


Sense your questions do not make.

> Can you help?


Obviously you resist being helped, so here’s how you can do what you ask
for, instead of making improvements:

<style>
b a { color: red !important }
</style>

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      10-03-2012
2012-10-03 14:36, MrBean wrote:

> Will try letter spacing for that menu.


I'm afraid increased letter spacing does not help, partly because it
would also increase the spacing of digits in "10", "11" etc. I
considered word-spacing, but since spaces are not used in the HTML
source, this won't help. But padding comes to rescue:

..rozdzil a { padding: 0 0.2em; }

You might wish to use a little smaller value there, but this - setting
left and right padding to 0.2em, i.e. 20% of font size - looks OK from
readability point of view.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
 
Reply With Quote
 
patriic48@gmail.com patriic48@gmail.com is offline
Junior Member
Join Date: Oct 2012
Location: Middle Sweden
Posts: 15
 
      10-13-2012
Color code with digits are 6 digits. Cut&Paste from for example photoshop: Below black & white, vice versa.

color="#ffffff"
or
color="#000000"

Regards / patriic48
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Re: Can I have b - for bold make in css in certain color? Hot-Text HTML 1 10-05-2012 02:31 PM
Make some dropdown items in a GridView Column Bold =?Utf-8?B?TmljayBaZHVuaWM=?= ASP .Net 1 03-27-2006 04:49 PM
How can we make one particular option's text bold in html. ahmad Javascript 1 03-08-2006 10:10 AM
need to make sure bold is alwyas on in wysiwyg editor Nancy Drew Javascript 0 12-02-2004 02:55 PM
how can i modify the bold status of a thing that i have the mouse on it? Carlis Javascript 9 11-14-2004 04:27 PM



Advertisments