Question

如果设备不支持短信，即手机（iPhone，Android等）上没有查看该页面，是否可以将href短信更改为href mailto？

我设法制作了一个“Shout”按钮，它使用sms发送页面的url，但我希望在没有在手机上查看时更改为mailto，即当正在查看页面时平板电脑，笔记本电脑等

这是我拼凑的代码：

<section id="shout">
    <button class="button shout"><a href="sms:?&body=mysite.com" class="shoutButton">Shout</a></button>
</section>

我正在使用外部CSS文件来设置页面和按钮的样式。它似乎适用于我尝试过的所有手机，所以这很酷。我已经研究过使用@media，但这似乎不是正确的方法，我尝试过其他方法但没有成功。我给了它一个很好的去，但我的技能不是很好，所以任何帮助都会受到赞赏。

谢谢：）

Answer 1

您可以创建两个链接，只显示基于 CSS @media query 的链接。

/* Default Style (mobile first!) */
.phone { display:inline; }
.desktop { display:none; } 


/* Desktops */
@media screen and (min-width:1024px) {
  .phone { display:none; }
  .desktop { display:inline; }  
}

<section id="shout">
    <button class="button shout phone">
      <a href="sms:?&body=mysite.com" class="shoutButton">Shout from Phone</a>
    </button>
    <button class="button shout desktop">
      <a href="mailto:something@something.com" class="shoutButton">Shout from Desktop</a>
    </button>
</section>

使用响应式设计将href短信更改为href mailto？

1 个答案: