CSS文件未链接到HTML

问题描述 投票:1回答:2

我最近开始学习自90年代中期以来第一次手工编写HTML和CSS代码(上次我试图建立一个网站,Netscape Communicator Gold 3.0出来了 - 所以请耐心等待我)。

我无法将我的CSS与我的HTML链接起来。我正在使用HTML5约定,并遵循Jennifer Robbins的流行书籍“学习网页设计”第4版中的代码示例。我看到的许多代码示例都使用HTML 5.0中不再需要的约定,因此我的代码可能有点稀疏。

我试图直接在HTML中嵌入样式,他们工作。但是,它们在CSS工作表中不起作用。我试图在IE11和最新版本的Chrome中加载页面,页面以白色显示默认浏览器设置。我的HTML文件和我的CSS文件位于同一目录中:c:/ RogersReviews。目录中有一个images文件夹,c:/ RogersReviews / Images。我链接到该文件夹​​中的图像文件,我的代码工作。

但是,我无法使用链接的CSS样式表更改页面的背景颜色。我试图让它变红以证明链接正常。下面是我的CSS代码,后面是我的HTML代码。

我在CSS中使用了Eric Meyer的浏览器重置代码来清除任何可能搞乱的浏览器设置。为方便起见,我省略了它。

这可能是我错过的一些小事。预先感谢您的帮助。

编辑:当我在这里发布时,页面似乎链接得很好,但是当我通过打开HTML文件从硬盘驱动器运行它时。我希望能够看到网页看起来像在线,但从我的硬盘驱动器。

body {
	background-color: red;
}
<!DOCTYPE html>
<html>
<head>
	<meta charset=utf-8>
	<title>Rogers Reviews: Academic Book Reviews </title>
	<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
<header>
	<img src="Images/Rogers-Reviews-logo-3.gif" alt="Rogers%20Reviews">
	<ul id="menu">
		<li><a href="">Home</a></li>
		<li><a href="">Authors</a></li>
		<li><a href="">Subjects</a></li>
	</ul>
</header>
<h1> Welcome </h1>
	<p> This site is a collection of academic book reviews, mostly in the humanities and the social sciences. </p>
	<p> The purpose of this site is to assist high school, undergraduate, and graduate history students with choosing appropriate secondary sources for their research papers. An emphasis is placed on older works written before 1960.</p>
	<p> <a href="RRindex.html"> Back to home </a> </p>
<footer>
	<p> &#169; 2014 </p>
	<p> <a href=""> About </a> </p>
	<p> <a href=""> Contact </a> </p>
</footer>
</body>
</html>
html css html5
2个回答
1
投票

我将你的代码逐字插入到JSFiddle中,背景为红色,如你所愿。

那么代码不是问题。相反,它是一个正确加载样式表的问题。尝试以下部分或全部内容:

  • 检查样式表名称,并在目录中与HTML代码中的名称相同;确保stylesheet.css存在正确。
  • 仔细检查该文件是否存在于正确的位置,该目录与您要打开的索引位于同一目录中。
  • 确保加载样式表。在Chrome中,如果右键单击 - >检查元素并转到“源”选项卡,则可以看到所有已加载的资源,包括CSS。如果它未在此处加载,则可能是它尝试从缓存加载。您可以通过再次打开检查器,单击齿轮菜单,并选中“禁用缓存(当DevTools打开时)”并重新加载您的站点,强制Chrome加载没有缓存的站点。
  • 检查您的本地apache / webhost服务器,确保它没有阻止加载某些文件或文件类型的任何设置。这假设您正在运行一个而不仅仅是在Chrome / IE中打开文件。如果是这种情况,您应该没有文件加载的问题。
  • 确保您保存了该文件。这很愚蠢,但是当我无法更新我的网站时,我可以亲自担保,我忘了保存/更新我正在查看的文件。

0
投票

简单的解决方案:没有更改你的HTML代码

  1. 我以“root”用户身份登录ubuntu。
  2. 然后转到/ var / www并右键单击www文件夹然后属性,我更改“查看内容”,“更改内容”和“访问内容”的权限以允许“任何人”

查看内容:任何人更改内容:任何人访问内容:任何人

  1. restart apache2服务器类型:service apache2 restart
  2. 然后测试网页

希望这可以帮助

© www.soinside.com 2019 - 2024. All rights reserved.