开发者

Allow ui-icon background to be used

We've got a site wide style sheet that's setting the background on a:link to transparent. This is causing a problem displaying the icons from jqueryui. In the example below the trash can icon associated with the ui-icon-trash CSS class is not being dis开发者_如何学Goplayed because the a:link background property overrules it.

I could apply the same styles ui-icon-trash uses to the link in question but that will be fragile if the jqueryui theme were ever to be updated in the future. Is there a way I can get the jqueryio icons to display at the same time as having a site wide background:transparent property on a:link?

<html>
  <head>
 <link rel="stylesheet" type="text/css" href="jquery-ui.css" />
 <style>
   a:link {
    text-decoration: underline;
    color: #066E37;
    background: transparent;
    } 
  </style>
   </head>
   <body>
     <a class="ui-icon ui-icon-trash" href="#"></a>
    </body>
 </html>


I don't see a real solution there, but I can offer two hacks:

  1. Put an additional <span> inside the <a> and apply the css to this element.

  2. Don't use <a> but <button> instead. Drawback: this would require additional javascript to make the button work.

If it is sufficient to override only the background color of your links, background-color: transparent instead of background: transparent could do the trick (but I guess you might have thought of that already).

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜