我是html / css的完整入门者。
我使用PHP在不同的网页中包含相同的标题。头部分中有一个href链接,该链接链接到外部CSS。样式化多个网页布局的文件。
由于不同的网页位于根文件夹的不同子文件夹中,因此我必须使用绝对路径链接CSS。文件,问题就来了:我不知道如何正确编写它。
当我为每个单独的网页使用相对路径时,链接可以正常工作,但是当我尝试使用绝对路径时,它根本不起作用。
我尝试过:
1.href =“文件:/// C:\ xampp \ htdocs \ root \ styles \ style.css”
2.href =“ file:/// C:/xampp/htdocs/root/styles/style.css”
3.href =“ file:// C:/xampp/htdocs/root/styles/style.css”
4.href =“ C:/xampp/htdocs/root/styles/style.css”
5.href =“ c:/xampp/htdocs/root/styles/style.css”
这是代码的开始部分:
<!DOCTYPE html>
<html lang="en">
<head>
<?php include('common/head.php') ?>
<title>Home</title>
</head>
这是头部:
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="file:///C:\xampp\htdocs\root\styles\style.css">
答案 0 :(得分:1)
要获取部分路径,请使用正斜杠
<link rel="stylesheet" href="/styles/style.css" rel="stylesheet" />
请注意,/
表示当前驱动器的根。
您还有./
,它表示当前目录。
../
表示当前目录的父目录。
答案 1 :(得分:0)
我想这是服务器端和客户端执行上下文之间的一个普遍误解。
http://localhost/whatever/index.htm
提供了html文档href="styles/style.css"
相对路径。浏览器将在http://localhost/whatever/styles/style.css
href="/styles/style.css"
一种绝对路径。浏览器将在服务器URL http://localhost/styles/style.css
的根目录中请求文件href="http://localhost/foobar/styles/style.css"
的绝对路径。浏览器将尝试从那里精确下载。href="file:///C:\...."
系统上的本地路径。服务器与它无关。该页面只能在您自己的系统上工作,而当其他人从其他计算机通过服务器访问该页面时,则无法使用。您的浏览器应该带有一些开发工具。您可以检查浏览器请求什么以及服务器使用该工具响应什么。
答案是:在此处使用相对或绝对的URL。
答案 2 :(得分:0)
使用HTML链接引用,当文件离开服务器时,您不能在域的根路径下请求文件。
例如使用http://localhost/index.php,您将无法获得超出所提供的根路径的任何信息。 (在这种情况下,从代码示例的外观来看C:\ xampp \ htdocs \ root)
如果以斜杠开始链接,则将为您提供绝对链接,并且始终从主机的根路径开始。这特别有用,因为您无需知道当前在网站中的位置。
<link href="/styles/style.css" />
<!-- this is seen as "{domain}/styles/style.css" -->
如果要将 relative 链接到当前路径,则可以省略第一个斜杠,这将根据当前路径查找文件。
<link href="styles/style.css" />
<!-- this is seen as "./styles/style.css" -->
如果您需要引用图片等,CSS文件中也是如此。
答案 3 :(得分:0)
我忘了提到我使用xampp来构建本地服务器来测试我的网站,但我发现与其将链接定向到计算机上的文件夹路径,我还应将其指向“ http://localhost/root/” ...”,这就解决了问题。