Question

我想知道是否有办法用css中的文本链接替换下面代码中的图像按钮。这是一个crm，其中html页面未打开进行编辑。只能编辑样式表。图像可以被替换，但它将是一个具有相同名称的文件。

<table class="MoreButTable">
    <tbody>
        <tr>
            <td>
                <a onmouseout="AndarButtonMouseOut('MoreButton');window.status='';return true;" onmouseover="AndarButtonMouseOver('MoreButton','../Style/SubtleButtons/AgencySearchOver.gif');window.status='&lt;p&gt;&nbsp;&lt;/p&gt;';return true;" href="javascript:WasItClicked=true; document.forms['Designation'].NavigationButton.value='More';document.forms['Designation'].submit();">
                    <img title="&lt;p&gt;&nbsp;&lt;/p&gt;" alt="&lt;p&gt;&nbsp;&lt;/p&gt;" name="MoreButton" src="../Style/SubtleButtons/AgencySearch.gif">
                </a>
            </td>
        </tr>
    </tbody>
</table>

Answer 1

如果你可以专门用CSS定位链接，那么你可以。

隐藏图片并在链接上使用伪元素。

＆＃13;

a [name="MoreButton"] {
  display: none;
}
a::before {
  content: 'You can seem me but not the image';
  display: inline-block;
}

＆＃13;

<a href="#1">
  <img title="Title" alt="ALt Text" name="MoreButton" src="http://www.fillmurray.com/140/100" />
</a>

＆＃13;

Answer 2

是的，可以使用伪选择器：

＆＃13;

a img {
  display: none;
}
a:before {
  content: 'Click me';
  cursor: pointer;
  display: block;
}

＆＃13;

<a href="#">
  <img src="http://placehold.it/350x150" />
</a>

＆＃13;

用文本链接替换图像按钮

2 个答案: