Question

这是HTML代码，我不知道我是否在那些＆lt;＆lt;链路/＆GT;

<! DOCTYPE html>
<html lang="es">
  <head>
    <title>Appicua</title>
    <link href="C:/Users/DAVID NEGRETE/Desktop/Portal web - Base code/portalWebStyle.css" rel="stylesheet" type="text/css" />
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  </head>
  <body>
    <div class="test"></div>
    <script src="C:/Users/DAVID NEGRETE/Desktop/web/js/jquery.js" type="text/javascript"></script>
    <script src="C:/Users/DAVID NEGRETE/Desktop/Portal web - Base code/portalWebExt.js" type="text/javascript" </script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  </body>
</html>

现在这是CSS代码：

.test{
  width:50px;
  height:50px;
  background-color:red;
  border-color:black;
  border-width:5px;
  border-style:solid;
  margin:5%;
}

正如您所看到的，这是一个简单的红色方块，问题是所有这些代码在Google Chrome和Internet Explorer上都运行良好，但在Firefox上它甚至不会显示在屏幕上。

为什么会这样？

Answer 1

您的目录结构看起来有点不稳定。如果我让您的链接更正您在目录树中的工作，如下所示：

如果你的HTML文件位于 web 目录中，那么你可以为你的css创建一个css目录（比如你已经拥有的js文件夹），并按照其他答案的建议相对引用这些文件。相对链接如下所示：

<script src="/js/jquery.js" type="text/javascript"></script>

和

<link href="/css/portalWebStyle.css" rel="stylesheet" type="text/css" />

链接样式称为relative，因为提供的css和js文件的路径是相对于目录结构中HTML文件的位置。

Answer 2

将文件重组为一个目录：

- appicua
    index.html
    - css
        main.css
    - js
        jquery.js
        main.js

然后你可以使用href="./css/main.css"获取main.css，使用src="./js/main.js"获取main.js。相对路径在这里更好，并且可能会有效。

您也无需指定type="text/css"和type="text/javascript";它们是多余的，因为浏览器为样式标签选择CSS，而对于脚本标签则选择JavaScript，并且对于JavaScript的正确MIME类型存在困惑。

您还可以删除链接代码中/之前的结束>。（除非你使用的是XHTML。）

Answer 3

我猜测firefox不会以同样的方式处理客户端文件。尝试将css / js文件只放在src="portalWebStyle.css"，只要它们与您打开的文件位于同一目录中。

Answer 4

我不知道这是否会解决您的问题，但您忘记了第二个链接标记末尾的/，并且忘记关闭第二个script代码。< / p>

CSS不适用于Firefox

4 个答案: