我正在使用font awesome在我的网站上添加社交媒体按钮。我遵循规则,但图标不显示这是我的网站的负责人
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>oktavianusm</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet" type="text/css">
<link href="fontawesome-free-5.3.1-web/css/fontawesome.min.css" rel="stylesheet" type="text/css">
这就是我在html中管理它的方式
<div class="social-media">
<i class="fab fa-facebook-square"></i>
<i class="fab fa-twitter-square"></i>
<i class="fab fa-linkedin-square"></i>
<i class="fab fa-google-plus-square"></i>
</div>
这就是我在浏览器中测试代码时发生的情况
this is what happenwhen I do the inspect element and point the cursor on the code
刚刚查看了Font Awesome网站:https://fontawesome.com/how-to-use/on-the-web/setup/getting-started?using=web-fonts-with-css。
这是正确的样式表链接:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"
integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU"
crossorigin="anonymous">
在我的网站上看着使用这些。
我有同样的问题。该链接间歇性地未加载到DOM中。它没有明显的原因,所以为了解决它,我添加了以下代码来手动添加链接。 jQuery用于向头部添加链接。如果它已经存在,那么你只是得到一个副本。
<!-- Font awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Font awesome force load as was not loading -->
<script>
$('head').append('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">');
</script>
我知道这不是一个漂亮的解决方案,但确实有效。我应该提到这个链接适用于4.7您需要将其更改为您想要的任何版本。