php - 无法在文本前面获得 Facebook 字形

Question

我有一个可以使用 Facebook 帐户登录的网站，我现在遇到的唯一问题是我无法在按钮中的文本前面从 Facebook 获取字形。在这里你可以看到代码。我也在用 Bootstrap，

<input type="button"onclick="window.location = '<?php echo $loginURL ?>';"
class="btn btn-block btn-social btn-facebook" value="Login met Facebook">

它是这样的:

我想得到这样的东西:

我知道你需要使用 span 类，但我无法让它在同一个按钮中工作，如果我使用 span 我得到图标但不是在同一个按钮中而是在它的下方或上方。

---

这是我现在得到的代码，它看起来是我想要的方式，但现在链接不起作用。所以我按下按钮，但没有任何反应。

<button onclick="window.location = '<?php echo $loginURL ?>';" 
class="btn btn-md" style="background-color:#3b5998; color:white; width:100%;">
<span class="fa fa-facebook mr-2"></span> Sign in with Facebook

下面的代码是有效的代码，但看起来不像我想要的那样..

<input type="button" onclick="window.location = '<?php echo $loginURL ?>';"
value="Login met Facebook" class="btn btn-block btn-social btn-facebook"> 

Answer 1

你有两个解决方案。

1. 更改 <input> 元素放入 <button> 元素。(简单的解决方案)

2. 你必须使用 ::before CSS 选择器，这需要更改 Font-Family到 Font-Awesome 字体并将正确的 unicode 放入 content CSS 属性。 (最难)

最简单的解决方案:

• 更改 <input>元素 到 <button>元素

• 为 FaceBook 图标添加具有 class 的任何 span 元素。