从外部文件导入CSS样式时,CSS样式不适用

时间:2012-04-21 22:28:46

标签: html css debugging

我有以下页面:

<html>
<head>
<title>Kahil</title>
<link rel="stylesheet" type="text/css" href="csshorizontalmenu1.css" />
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" dir="RTL">
<center>
<div class='horizontalcssmenu'>
  <ul  id='cssmenu1'>
    <li><a href=''>Menu1</a></li>
    <li><a href='/pages/F4F8E5F4E9EC.php'>Menu2</a></li>
    <li><a href='http://kahil.bizclick.co.il/pages/F2E1E5E3E5FA.php'>Menu3</a></li>
    <li><a href='/pages/E2ECF8E9E4.php'>Menu4</a>
      <ul class='box'>
        <li><a href='/pages/E2ECF8E9E4/EEE3E1F7E5FA.php'>Menu4.1</a></li>
        <li><a href='/pages/E2ECF8E9E4/EEE5F6F8E9-F4F8F1E5ED.php'>Menu4.2</a></li>
        <li><a href='http://kahil.bizclick.co.il/pages/E2ECF8E9E4/E4E3F4F1E4-F2EC-E7E5ECF6E5FA.php'>Menu4.3</a></li>
      </ul>
    </li>
    <li><a href='/pages/F6E5F8-F7F9F8.php'>Menu5</a></li>
  </ul></div>

</body>
</html>

我希望在其上应用以下CSS样式:

.horizontalcssmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
}

/*Top level list items*/
.horizontalcssmenu ul li{
position: relative;
display: inline;
float: right;

}

/*Top level menu link items style*/
.horizontalcssmenu ul li a{
display: block;
width: 60px; /*Width of top level menu link items*/
padding: 2px 8px;
text-decoration: none;
/*background-color: #1C3702;*/
color: #7E4732;
font: bold 12px Arial, Helvetica, sans-serif;
}

/*Sub level menu*/
.horizontalcssmenu ul li ul{
left: 0;
top: 0;
position: absolute;
display: block;
visibility: hidden;
z-index: 100;
}

有线的是,如果它在示例中的文件中,没有应用任何样式,但是当我用<style> ... </style>内联它们时,它突然起作用。我已经检查了link标签100次,我找不到什么错误。

修改 根据要求,我将其上传到here整个文件夹现在包含2个文件,index.htmlc1.css。格式应该是纯文本,因为我使用Notepad ++编辑它们,但CSS文件最初是下载的。为方便调试,我已将style标记放在那里并对其进行了注释。您可以在第5行的末尾添加>以查看其是否有效。

3 个答案:

答案 0 :(得分:4)

您的HTML文件是UTF-16格式,而CSS文件则不是。这对浏览器来说非常混乱。

保存时,请确保它们具有相同的编码,或者在其HTTP标头中明确指定CSS文件的编码。

答案 1 :(得分:3)

它只能是路径。我注意到您显示的路径不是根路径(以/开头),因此将取决于站点中页面的位置。我会使用firebug的网络标签来查看发生了什么。

答案 2 :(得分:1)

我只是按照Chrome检查器中的css链接(而不仅仅是输入路径)并得到了一组似乎是“中文类型”的字符 - 显然是一些unicode错误

栮牯穩湯慴捬獳敭畮甠筬洊牡楧㩮〠਻慰摤湩㩧〠਻楬瑳猭祴敬琭灹㩥渠湯㭥紊ਊ⨯潔⁰敬敶楬瑳椠整獭⼪⸊潨楲潺瑮污獣浳湥⁵汵氠筩瀊獯瑩潩㩮爠汥瑡癩㭥搊獩汰祡›湩楬敮਻汦慯㩴爠杩瑨਻紊ਊ⨯潔⁰敬敶敭畮氠湩瑩浥⁳瑳汹⩥ਯ栮牯穩湯慴捬獳敭畮甠楬愠੻楤灳慬㩹戠潬正਻楷瑤㩨㘠瀰㭸⼠圪摩桴漠⁦潴⁰敬敶敭畮氠湩瑩浥⩳ਯ慰摤湩㩧㈠硰㠠硰਻整瑸搭捥牯瑡潩㩮渠湯㭥⼊截捡杫潲湵ⵤ潣潬㩲⌠䌱㜳㈰⨻ਯ潣潬㩲⌠䔷㜴㈳਻潦瑮›潢摬ㄠ瀲⁸牁慩ⱬ䠠汥敶楴慣‬慳獮猭牥晩਻੽ਉ⨯畓⁢敬敶敭畮⼪⸊潨楲潺瑮污獣浳湥⁵汵氠⁩汵੻敬瑦›㬰琊灯›㬰瀊獯瑩潩㩮愠獢汯瑵㭥搊獩汰祡›汢捯㭫瘊獩扩汩瑩㩹栠摩敤㭮稊椭摮硥›〱㬰紊

这很奇怪 - 但显然导致问题(而不是我之前建议的路径)