我正在尝试使用 Kevin Castro 的 Pen 在我的网站上添加一个 float 的 WhatsApp 按钮:https://codepen.io/demoonkevin/pen/MvPEpV
这是我正在使用的 HTML:
<a href="https://api.whatsapp.com/send?phone=12345&text=&source=&data=" class="whatsApp" target="_blank"><i class="fa fa-whatsapp my-whatsApp"></i></a>
这是 CSS:
/* WhatsApp Button */
.whatsApp{
position:fixed;
width:60px;
height:60px;
bottom:40px;
left:40px;
background-color:#25d366;
color:#FFF;
border-radius:50px;
text-align:center;
font-size:30px;
box-shadow: 2px 2px 3px #999;
z-index:100;
}
.my-whatsApp{
margin-top:16px;
}
但是，有几个问题:
- 它在移动设备上不起作用？该按钮未显示在页面上的任何位置...
- 当我在我的页面上插入代码时，whatsapp Logo 不是白色的(如果你看上面的笔，它有一个绿色 Logo ，图标中间有一个白色 whatsapp)。
最佳答案
要解决颜色问题，请将以下 css 添加到您的 my-whatsApp 类中，因为 a:visited 属性会覆盖颜色
color: white;
在移动设备上，当我从浏览器尝试时看起来它可以工作
关于html - float WhatsApp 按钮 HTML 和 CSS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58958889/