Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Senior Member jbagley's Avatar
    Join Date
    Sep 2004
    Location
    Cape Town
    Posts
    845
    Member #
    7422
    Is it possible to have inline CSS specified for an <a> tag and specify the a:hover and a:link attributes?

    The reason for this is Im trying to use CSS in an outlook HTML email signature, and the only way Outlook will render CSS is if its inline.

    This is what I have currently, but I was wondering if I could specify the a:link and a:hover attribute to the <a> tag.
    HTML Code:
    <body>
    <div style="font-family:'Trebuchet MS', Georgia, Arial; font-size:0.8em">
    <p style="margin:0px; padding:0px; font-weight:bold; color:#95ba65;"><a href="http://www.jasonbagley.com" style="color: #95ba65;">Jason Bagley</a></p>
    <p style="margin: 0px; padding: 0px; font-size: 0.8em; color: #626262; text-decoration: none;">
    (T): +27 21 xxx xxxx<br />
    (C): +27 82 xxx xxxx</p>
    </div>
    </body>

  2.  

  3. #2
    Senior Member Fallout's Avatar
    Join Date
    Aug 2003
    Location
    Richmond, Virginia
    Posts
    543
    Member #
    2748
    I don't think you can style hovers inline... but have you at least tried just writing the regular syntax on one line?

    Code:
    <p style='a:hover { styles } a:link { styles }'>
    I'm not sure how well that would work. Try reading this article if you are having trouble getting the styles to work (or if you just get stuck): http://www.campaignmonitor.com/blog/...ing_css_1.html

  4. #3
    Senior Member Rince's Avatar
    Join Date
    Nov 2004
    Posts
    183
    Member #
    8318
    Fallout's code won't work. But have you tried putting the css styles into the html like this
    Code:
    <STYLE>
    <!--
     a:hover{color:#ff0080;}
    -->
    </STYLE>
    <a href="file.html">text</a>
    Alternativly, there is an older fromat where the anchor styles were put into the body tag. It's not valid to w3c specs, but if it works... Have a go with:
    Code:
    <body  link='#0000FF'alink='#800000' vlink='#FF0000' text='#000000'>
    Though as you may have noticed, this does everything except hover.

    Before CSS, the only way to do the hover was to use javascript. e.g.
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    <script language="JavaScript" type="text/JavaScript">
    <!--
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_changeProp(objName,x,theProp,theValue) { //v6.0
      var obj = MM_findObj(objName);
      if (obj && (theProp.indexOf("style.")==-1 || obj.style)){
        if (theValue == true || theValue == false)
          eval("obj."+theProp+"="+theValue);
        else eval("obj."+theProp+"='"+theValue+"'");
      }
    }
    //-->
    </script>
    </head>
    
    <body>
    <p><a href="#"><span id="linkone" onMouseOver="MM_changeProp('linkone','','style.color','#FF0000','SPAN')" onMouseOut="MM_changeProp('linkone','','style.color','#0000FF','SPAN')">asdfasdf</span></a></p>
    </body>
    </html>
    Also, remember that not everyone uses Outlook. Test you emails in Thunderbird, Opera and other common email clients (inclusing online ones like gmail and hotmail.)


Remove Ads

Posting Permissions

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

Search tags for this page

a hover inline
,
css hover inline
,

css inline hover

,

hover css inline

,
inline css hover
,
inline hover
,
inline hover color css
,

inline hover css

,
inline style css hover
,
using inline styles a hover
Click on a term to search for related topics.
All times are GMT -6. The time now is 03:07 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com