SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Enthusiast djchazza's Avatar
    Join Date
    Jan 2004
    Location
    Sydney, Australia
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Link without changing color or style

    How do I create a link on a word without changing the color or style of the text? Usually applying <a> to the word applies the blue color and the underlining. Is there a way to prevent <a> from applying any visual changes to the word besides the cursor changing to a hand pointing.

    Eg. Imagine my link style is:
    a { color: orange } which makes a link look this

    Now imagine I have a huge colored heading like this:
    My cool heading

    I want to make this a link but I don't want it to be orange or underlined. How?
    I can manage the underlined part, but what about color.

    Eg. Is there something like:
    .fooclass a { color: #leave it as it is#; text-decoration: none }
    djchazza
    Remote Spy Software - PC and Internet Monitoring
    Internet Spy Software - Web Filtering and Usage Reporting

  2. #2
    Drupaler bronze trophy greg.harvey's Avatar
    Join Date
    Jul 2002
    Location
    London, UK
    Posts
    3,258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Nearly. Subclasses.

    a.fooclass1 { blah blah }
    a.fooclass2 { blah blah }

    Then:

    <a href="blah" class="fooclass1">blah</a>
    <a href="blah" class="fooclass2">blah</a>

    Etc.

    Edit:

    Or have I missed your question...? You can use subclasses to retain colour by making them the same as the colour of the text of course...

  3. #3
    SitePoint Zealot
    Join Date
    Sep 2003
    Location
    Birmingham UK
    Posts
    100
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    shouldn't that be

    a.fooclass:link { blah }
    a.fooclass:visited {blah }

    etc.?
    Rich.
    Late Night, Cold Coffee: Like daytime, but darker.

  4. #4
    Drupaler bronze trophy greg.harvey's Avatar
    Join Date
    Jul 2002
    Location
    London, UK
    Posts
    3,258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Shouldn't need it unless you want to specify a different visited colour, etc... I think...

  5. #5
    SitePoint Enthusiast djchazza's Avatar
    Join Date
    Jan 2004
    Location
    Sydney, Australia
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think you missed my question. I'll try to give a more clear example.

    Here is a black bold heading:
    <h1>Test</h1>

    When you wrap a link around it, it turns blue and becomes underlined, right?
    <h1><a href="foo.html">Test</a></h1>

    Now how do I prevent <a> from changing the color of the black <h1> heading?

    WAIT! You're going to say, that's easy! All you need to do is:
    h1 a { color: black; text-decoration: none } and it will look the same right?

    This is not what I want though. I want you to assume you don't know what color the text in the <h1> fields are. In my real scenario, the text is multiple colors so applying a single color to <a> will not help.

    Is there a solution? I simple want to tell <a> not to apply a new color, delete it's color value, etc.
    djchazza
    Remote Spy Software - PC and Internet Monitoring
    Internet Spy Software - Web Filtering and Usage Reporting

  6. #6
    Drupaler bronze trophy greg.harvey's Avatar
    Join Date
    Jul 2002
    Location
    London, UK
    Posts
    3,258
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ahhhhh!! Got you! Um....

    No idea.

  7. #7
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,262
    Mentioned
    60 Post(s)
    Tagged
    3 Thread(s)
    i have an idea but you may not like it

    if you're going to "hide" the fact that it's a link, the easiest way to do that is not to make it a link

    why are you doing it, anyway? search engine spamming, er, i mean, optimization?

    if you need a link, make it a link

    if you need a heading to be a link, make it a link

    otherwise, don't bother, 'cause nobody's a-gonna be clickin' on nothin' that don't look like a link nohow
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  8. #8
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    You use multiple <span> for each letter assigned a different colour if you want the rainbow effect and set the background-color to transparent.

    But basically there is no automatic way for it to dectect the background colour.

  9. #9
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Alternatively there is the option of using CSS inherit if you just wanted it to match the parent colour, again this fails in M$ Explorer.

    <style type="text/css">
    <!--
    p.red {color: red;}
    a:link {color: inherit; text-decoration: underline; font-weight: bold;}
    -->
    </style>

    ...

    <p class="red">Lorem Ipsum<a href="#"> Look I'm Red </a>Like my Parent.</p>

    I must be rusty from the Christmas break.

  10. #10
    SitePoint Enthusiast djchazza's Avatar
    Join Date
    Jan 2004
    Location
    Sydney, Australia
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by xhtmlcoder
    Alternatively there is the option of using CSS inherit if you just wanted it to match the parent colour, again this fails in M$ Explorer.
    Yeah seen that, tried that. No good for my needs unfortunately.

    I'll accept there is no answer and just do it the hard and ugly way.
    djchazza
    Remote Spy Software - PC and Internet Monitoring
    Internet Spy Software - Web Filtering and Usage Reporting


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •