使用 css 更改 html 标记的 href
Posted
技术标签:
【中文标题】使用 css 更改 html 标记的 href【英文标题】:Changing the href of an html tag with css 【发布时间】:2013-02-27 16:47:45 【问题描述】:我需要从
更改此 A 标签<a href="contact.html" >Contact</a>
到
<a href="tel:+13174562564" >Contact</a>
如果可能或像这样,只使用 Css
<a href="tel:+13174562564" >+13174562564</a>
我有很多页面,我不想编辑所有页面,这将花费我一生的时间,这就是为什么我需要在 CSS 中进行,并且我没有链接到它们的 JS
【问题讨论】:
【参考方案1】:一种解决方案是隐藏一个标签并放置另一个
<div id="tag1">
<a href="#tag1">link1</a>
<a href="#tag2">link2</a>
</div>
css:
a[href="#tag1"]
display:block;
a[href="#tag2"]
display:none;
#tag1:target a[href="#tag1"]
display:none;
#tag1:target a[href="#tag2"]
display:block;
我将这种方法用于菜单栏的响应式“按钮”
【讨论】:
【参考方案2】:CSS 用于presentation,不能用于以您想要的方式修改 HTML 标记。 为此,您需要 javascript。
应该是fairly short script.
【讨论】:
【参考方案3】:CSS 只是显示,你不能用它修改文档对象模型。抱歉,这无法完成。我希望我有一个更好的答案,但“做不到”是唯一的答案。
【讨论】:
以上是关于使用 css 更改 html 标记的 href的主要内容,如果未能解决你的问题,请参考以下文章
是否可以使用 CSS 使 HTML 锚标记不可点击/不可链接?