A stupid CSS question- anybody know how?

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • whorehole
    Confirmed User
    • Jan 2004
    • 299
    #1

    A stupid CSS question- anybody know how?

    This is something I've never figured out, I've researched it, but never found an answer- it may not even be possible, but I figured somebody on here would know if it is.


    I've got a page all setup with tons of CSS.

    but say I have one little bit of text that I want to make a color, and ALSO be hyperlinked, and have a seperate hovercolor.

    I want to just code it inline using a SPAN tag, and not write a giant bunch of CSS code just for this one word.

    So the text link should be white, and when hovered over, it would turn black.


    This will turn the text white, etc:


    <a href="http://www.myurl.com" ><span style="font-family: arial; font-weight: bold; font-size: 12px; color: white; ">CLICK HERE</span></a>


    But can I define a hover color in that span tag?


    I've never found any code that would do it..

    can it be done?


    Thanks for any help!
    Tags: None
    • prezzz
      Confirmed User
      • Jul 2004
      • 959
      #2
      If it's just one instance in the code, drop the span part, give the <a> an id and add 2 lines of code to the css file.

      <a href="http://www.myurl.com" id="thisone">CLICK HERE</a>

      a#thisone:link, a#thisone:visited { font: 700 12px Arial, sans-serif; color: #fff; }
      a#thisone:hover, a#thisone:active { color: #000; }

      TEMPLATEHYPE.COM - PREMIUM MECHBUNNY TEMPLATES
      Responsive Mechbunny templates now available - NEAT TUBE - REDDY TUBE

        Comment

        • The Truth Hurts
          Zph7YXfjMhg
          • Nov 2002
          • 15738
          #3
          pretty sure you cant do pseudo shit inline.
          add something like this silly shit to your anchor
          onmouseover="this.style.color='value';"
          onmouseout="this.style.color='value';"

            Comment

            • Amputate Your Head
              There can be only one
              • Aug 2001
              • 39075
              #4
              Originally posted by The Truth Hurts
              pretty sure you cant do pseudo shit inline.
              add something like this silly shit to your anchor
              onmouseover="this.style.color='value';"
              onmouseout="this.style.color='value';"
              hey dude... haven't seen you around in a while.
              SIG TOO BIG

                Comment

                • Why
                  MFBA
                  • Mar 2003
                  • 7230
                  #5
                  i believe prezzz is correct... im sure there are other ways but thats the simple and straightforward answer.

                    Comment

                    • BestXXXPorn
                      Confirmed User
                      • Jun 2009
                      • 2277
                      #6
                      Originally posted by prezzz
                      If it's just one instance in the code, drop the span part, give the <a> an id and add 2 lines of code to the css file.

                      <a href="http://www.myurl.com" id="thisone">CLICK HERE</a>

                      a#thisone:link, a#thisone:visited { font: 700 12px Arial, sans-serif; color: #fff; }
                      a#thisone:hover, a#thisone:active { color: #000; }
                      Perfect, there's no need for a span inside the anchor tag... Especially if you want a hover state as some browsers will only recognize anchors to have :hover...

                      I would probably opt for a class instead of an id in case you want to reuse it later:

                      <a href="http://www.whatever.com" class="blackWhite">Click Here</a>

                      a.blackWhite, a.blackWhite:visited { font: ...; color: #fff; }
                      a.blackWhite:hover, a.blackWhite:active { color: #000; }

                      Then you can just use the css class on any anchor tag you may want but for sure, as prezzz used... break it out into the style sheet. That way you can update it whenever you want without searching through mounds of copy...
                      ICQ: 258-202-811 | Email: eric{at}bestxxxporn.com

                        Comment

                        • FlexxAeon
                          Confirmed User
                          • May 2003
                          • 3765
                          #7
                          Originally posted by BestXXXPorn
                          Perfect, there's no need for a span inside the anchor tag... Especially if you want a hover state as some browsers will only recognize anchors to have :hover...

                          I would probably opt for a class instead of an id in case you want to reuse it later:

                          <a href="http://www.whatever.com" class="blackWhite">Click Here</a>

                          a.blackWhite, a.blackWhite:visited { font: ...; color: #fff; }
                          a.blackWhite:hover, a.blackWhite:active { color: #000; }

                          Then you can just use the css class on any anchor tag you may want but for sure, as prezzz used... break it out into the style sheet. That way you can update it whenever you want without searching through mounds of copy...
                          flexx [dot] aeon [at] gmail

                            Comment

                            • whorehole
                              Confirmed User
                              • Jan 2004
                              • 299
                              #8
                              Thanks for the replies guys

                              I was trying to avoid using an id or class (or having to add shit to the css file) and just be able to whip it out right there on the line, but oh well

                              The Truth Hurts- I will try that technique

                                Comment

                                Previous template Next
                                Working...