坑爹的CSS不起作用
坑爹的CSS不起作用作者：夜飞羽 来源：mxria.com 时间：2012-02-25
<div class="artcontent">刚刚花了半个小时，解决了一个站点无视style.css的存在，页面内容显示正常，但样式全部没有作用。针对CSS不起作用的问题，查了好久，尝试了不同的方法，最终解决了，但非常坑爹！现在把过程总结出来，供后来者参考。说不定你哪天就遇到了！
症状：为客户做的一个企业普通网站，纯HTML。本地正常显示的网站内容，FTP到服务器上后成了裸奔状态，所有的CSS样式都没有效果。
解决方法：
可能原因1：XHTML文档类型设置不正确
在文档申明中，有3种类型，Dreamwaver的默认类型和VS类型有些时候不一致。主要就是如下代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Frameset.dtd">
一般会有上面3种文档类型设置，确实一直使用默认值，很少遇到类似问题。网上查了，描述如下
Transitional类型：是指一种过渡类型，使用这种类型浏览器对XHTML的解析比较宽松，允许使用HTML4.01中的标签，但必须符合XHTML的语法。这种是现在通用的方法，用dreamweaver创建网页时默认就是这种类型。
Strict类型：严格类型，使用时浏览器将相对严格，不允许使用任何表现形式的标识和属性，如在元素中直接使用bgcolor背景色属性等。
Frameset类型：框架页类型，如果网页使用了框架结构，就有必要使用这样的文档声明。
于是我首先想到检查这个，但结果不是这个原因，网页内容中就是Transitional类型。非常宽松，关键在本地机器上显示正常。
可能原因2：服务器因为Linux OS，是不是有大小写或全角字符因素影响
在引用style.css文件的位置确认了，全站只有1个css文件，里面引用到图片文件的内容也只有一个目录imgs，跟服务器上文件名称核对后排除了该因素。不过，还是总结成一项，因为看到网上有人遇到同样的CSS不起作用，原因就是大小写敏感导致。同时对css文件中容易出问题的：；等进行了搜索检查，未发现异常。
可能原因3：css文件编码和网页编码不一致
这个之前有遇到过，特别是多人合作，多环境开发时会有人不注意使得文件编码格式不一致。虽然概率较小，还是认真检查了一遍。利用记事本将css文件特地保存为不同编码格式，问题依然存在。因为网站内容不涉及到数据库读取数据，基本都是静态内容，编码不一致问题也排除了。
可能原因4：元素作用域的问题
看到网上有类似问题的朋友很多是局部样式不起作用，比如设置某个表格内容的字体颜色，一般是没有明白CSS属性的优先级问题。比如文字有span标签定义了字体属性，在外面的div或table容器中再定义对应的字体属性时，div或table容器中定义的CSS样式将不起作用。
但今天的问题是整站故障，不是部分CSS选择器出现不起作用的问题，因此也可以排除。
可能原因5：坑爹的原因-文件名称style.css属于特定名称？？
走途无路之时，冒出一个坑爹的想法：会不会是因为文件名称不对？ 于是将style.css换成style1.css，结果意外发生，居然就好了。当我看到那五彩缤纷的页面样式时，简直想操蛋了！
为什么会这样，我尚未调查清楚，客户用的是新网的Linux服务器，鉴于新网的长期不靠谱，本文谨慎参考，只是提供了一次学习的样本而已!
页:
[1]