CSS文件未链接到HTML

时间:2014-12-19 22:23:46

标签: html css html5

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

我无法将我的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>

4 个答案:

答案 0 :(得分:1)

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

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

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

答案 1 :(得分:1)

尝试使用href="stylesheet.css"代替href="/stylesheet.css"

我遇到了同样的问题,这对我有用。

答案 2 :(得分:1)

你好,也许对某人有帮助

css文件必须以“ text / css”作为内容类型进行传输(而您的html页面内容通常是“ text / html”)。

声明正确的传输值很重要,因为浏览器会检查它。
我在Delphi中遇到了这个问题,试图在WebBroker应用程序中声明“ DOCTYPE HTML”以使用HTML5,但问题一直存在解决了将其设置为变量reponse.contenttype的问题。如果您使用的是Web服务器,我想您必须将文件放在例如正确的文件夹中,或在正确的位置设置此属性,以指示服务器发送正确的contenttype。

祝您有美好的一天!

答案 3 :(得分:0)

简单的解决方案:您的html代码没有任何变化

  1. 我以“ root”用户身份登录ubunto。

  2. 然后转到/ var / www并右键单击www文件夹,然后单击属性 并且我将“查看内容”,“更改内容”和“访问内容”的权限更改为允许“任何人”

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

  1. 重新启动apache2服务器类型:服务apache2重新启动
  2. 然后测试网页

希望这会有所帮助