Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/matlab/13.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 当我访问某些URL时,字体图标不会显示_Css_Font Awesome - Fatal编程技术网

Css 当我访问某些URL时,字体图标不会显示

Css 当我访问某些URL时,字体图标不会显示,css,font-awesome,Css,Font Awesome,我正在一个react项目中使用font awesome的脱机版本。我按照这个来设置它。我的问题是图标在某些页面上有效,但在其他页面上无效。例如他们在localhost/courses上工作,但在localhost/courses/1上不工作。或者他们在localhost/authors上工作,但不在localhost/authors/1上工作。我希望你能看到这种模式。我如何着手解决这个问题?下面是我如何实现当前解决方案的。 我下载了包含几个文件夹的脱机包。然后我在标记中引用了/css/all.c

我正在一个react项目中使用font awesome的脱机版本。我按照这个来设置它。我的问题是图标在某些页面上有效,但在其他页面上无效。例如他们在
localhost/courses
上工作,但在
localhost/courses/1
上不工作。或者他们在
localhost/authors
上工作,但不在
localhost/authors/1
上工作。我希望你能看到这种模式。我如何着手解决这个问题?下面是我如何实现当前解决方案的。 我下载了包含几个文件夹的脱机包。然后我在
标记中引用了
/css/all.css
/js/all.jsinside

<head>
  <link href="/folder/css/all.css" rel="stylesheet">
  <script defer src="/folder/js/all.js"></script>
</head>
<body>
  <i class="fas fa-user"></i> <!-- uses solid style -->
  <i class="far fa-user"></i> <!-- uses regular style -->
  <i class="fal fa-user"></i> <!-- uses light style -->
  <!--brand icon-->
  <i class="fab fa-github-square"></i> <!-- uses brands style -->
</body>

让我试着回答你的问题

最安全的方法是使用以下字体资源的完整URL(或其他完整URL,如果您的URL不同,则我提供):


另一种解决方案是使用如下代码(通过添加../),但您必须计算URL结构在特定页面上工作的时间:

<head>
  <link href="../folder/css/all.css" rel="stylesheet">
  <script defer src="../courses/folder/js/all.js"></script>
</head>


我希望这个解决方案对您有用。

让我试着回答您的问题

最安全的方法是使用以下字体资源的完整URL(或其他完整URL,如果您的URL不同,则我提供):


另一种解决方案是使用如下代码(通过添加../),但您必须计算URL结构在特定页面上工作的时间:

<head>
  <link href="../folder/css/all.css" rel="stylesheet">
  <script defer src="../courses/folder/js/all.js"></script>
</head>


我希望这个解决方案对您有用。

我使用React的
%PUBLIC\u URL%
解决了这个问题,React提供了该解决方案-scripts@0.5.0更高。你可以读到它。下面是我现在如何引用font awesome文件,因为它们位于React项目的
public
文件夹中名为
font awesome
的文件夹中

<link type="text/css" rel="stylesheet" href="%PUBLIC_URL%/font-awesome/css/all.css">
<script defer src="%PUBLIC_URL%/font-awesome/js/all.js"></script>

我通过使用React的
%PUBLIC\u URL%
解决了这个问题,React提供了React-scripts@0.5.0更高。你可以读到它。下面是我现在如何引用font awesome文件,因为它们位于React项目的
public
文件夹中名为
font awesome
的文件夹中

<link type="text/css" rel="stylesheet" href="%PUBLIC_URL%/font-awesome/css/all.css">
<script defer src="%PUBLIC_URL%/font-awesome/js/all.js"></script>


能否提供开发人员控制台的屏幕截图?控制台中没有任何内容。但是,我检查了网络选项卡,发现我可以预览图标所在页面上的all.css和all.js文件。另一方面,我无法预览图标不起作用的页面上的文件。当我点击他们时,我得到一条信息“你需要启用JavaScript来运行这个应用程序。”你能提供一个开发者控制台的屏幕截图吗?控制台中没有任何内容。但是,我检查了网络选项卡,发现我可以预览图标所在页面上的all.css和all.js文件。另一方面,我无法预览图标不起作用的页面上的文件。当我点击它们时,我会收到一条信息“你需要启用JavaScript来运行这个应用程序。”谢谢@kokom,不幸的是这些解决方案对我不起作用。谢谢@kokom,不幸的是这些解决方案对我不起作用。