新的CSS定义没有得到从链接的样式表

问题描述：

<link type="text/css" rel="stylesheet" href="css/resources/css/lessons-matching-test.css"/>

在文档

<div class="tests"> 
    <a href="" style="display: block;">Link</a> 
</div>

的身体在链接CSS样式表我添加了这个新风格

.tests 
{ 
    background-color: blue; 
    /* some stuff */ 
}

为什么我的风格不适用于将class=tests添加到我的div中？

您不必重新启动系统，只需使用CTRL + F5 :) – HamZa 2013-03-15 23:29:31

请将您的代码放入jsfiddle.net – AliBZ 2013-03-15 23:29:34

您是否尝试过使用浏览器的开发人员工具来追踪“div”获取它的位置造型信息？（IE，火狐，铬有这个，按F12打开它） – frozenkoi 2013-03-15 23:30:29

答

当我创建一个新的HTML文件并插入代码（没有外部css和js文件）时，我得到了期望的结果。

<!DOCTYPE html> 
<html lang="en"><!-- Forgot the quotes --> 
<head> 
    <meta class="metatype" content="matching-test"> 
    <meta charset="UTF-8"> 
    <style type="text/css"> 
     .tests 
     { 
      background-color: blue; 
      /* some stuff */ 
     } 
    </style> 
</head> 
<body> 
    <div class="tests"> 
     <a href="" style="dispaly: block;">Link</a> 
    </div> 
</body> 
</html>

当您排除js文件和/或css文件时会发生什么？

答

两起案件

您lessons.js做与.tests东西

<script type="text/javascript" src="js/resources/js/libs/lessons.js"></script>

你的CSS设置.tests为重要，这样你不能改变

<link type="text/css" rel="stylesheet" href="css/resources/css/lessons-matching-test.css"/>

答

问题是你由于缓存原有的风格正在被使用。您的新样式不显示，因为浏览器正在使用旧样式。有几种方法可以解决或改变这一点。

避免这种情况的技术被称为“缓存清除”。当涉及服务器端处理程序时，可以用更高级的语言来处理。但是如果没有访问权限，那么通常会使用版本名称。

lessons-matching-test-v1.css

每次进行更改时都会以这种方式命名您的css文件，这将允许使用和缓存新版本。以前的版本，你会增加数字，所以版本2将是经验教训匹配测试v2.css。

另一种方法是在每次制作新版本

href="css/resources/css/lessons-matching-test.css?v=1.0"

，然后在每次制作新版本时时间查询字符串附加到路径，更改查询字符串，所以第2版将href="css/resources/css/lessons-matching-test.css?v=2.0"

新的CSS定义没有得到从链接的样式表

相关推荐