在链接标记HTML中引用另一个本地目录中的CSS文件

时间:2017-06-22 08:23:52

标签: html css

我的PC中有一个HTML文件和一个CSS文件,位于不同的目录中。 在head标签中我使用链接标签来引用我的css文件

<link href="C:\Users\UserName\Desktop\Web_testing\BGsample SS.css"
  type="text/css" rel="stylesheet" />

这不起作用

4 个答案:

答案 0 :(得分:2)

尝试使用file:/// protocol。

href='file:///C:\Users\UserName\Desktop\Web_testing\BGsample SS.css'

如果这不起作用(并且你说它没有),那么我的猜测是它根本不起作用,因为它被浏览器中的安全功能阻止了。 这取决于您从哪里加载主HTML内容,但如果从互联网上加载主HTML,那么我就能理解为什么浏览器可能会反对从客户端机器的本地文件系统加载CSS。

最后一件事要尝试:您可以尝试在计算机上设置Web服务器,将mystyles.css文件放入Web文件夹,然后使用以下命令将其加载到页面中:

href='http://localhost/mystyles.css'

我不能提出太多建议,我不这么认为。

答案 1 :(得分:2)

检查您的路径,最佳做法是始终使用相对路径。实施例

如果样式表名为style.css,则链接应为:

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

如果你在子目录中有css文件(并且子目录名为styledirectory),则链接变为:

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

如果css文件位于html文件的父目录中,则链接变为:

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

.. 上升到1目录,如果你需要两个,你可以这样做: ../../

示例文件夹结构

enter image description here

假设结构如此,

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

名称文件也没有空格。

答案 2 :(得分:0)

您应该使用'../'移回路径,然后使用CSS文件进入目录。

答案 3 :(得分:0)

请始终遵循CSS外部样式表方式。在您的情况下,无法找到CSS文件。尝试在SS.css

之前添加\
<link rel="stylesheet" type="text/css" href="C:\Users\UserName\Desktop\Web_testing\BGsample\SS.css">