外部样式表在Chrome / Opera中不起作用 - 内部样式表有效

时间:2015-03-06 06:38:14

标签: html css google-chrome opera

当我在内部时,我的所有CSS在FF,Safari,IE,Opera和Chrome中运行良好。我复制并将其移动到外部样式表。在FF,Safari和IE中,一切看起来都不错,但在Opera(27)和Chrome(41)中,大多数样式都很好,但有些布局被打破了。它似乎只是在页面顶部有一些div浮动问题。

任何人都知道为什么我只会遇到一些规则问题(这意味着它会链接到css文件),只在外部而且只在Chrome和Opera中?

CSS和HTML都会验证。

<head>
    <meta charset="utf-8">
    <title>Drum Lessons</title>
    <link href='http://fonts.googleapis.com/css?family=Cabin' rel='stylesheet' type='text/css'>
    <link href="style_copy.css" rel="stylesheet" type="text/css">
</head>



    body        {
                width: 1020px;
                margin: 0 auto;
                font-family: Futura, 'Cabin', Arial, sans-serif;
                /* font-weight: light; */
                font-size: 1em;
                background-color: #696969;
                }

    h2          {
                width: 220px;
                margin: 0 auto;
                padding-bottom: 10px;
                font-weight: normal;
                /* font-style: italic; */
                }

    #header     {
                width: 1020px;
                height: 120px;
                background-image: url('images/header_bg.jpg');
                }

    #header-border  {
                width: 1002px;
                height: 102px;
                border: 9px solid black;
                }

    #navicons   {
                list-style-type: none;
                float: right;
                margin-right: 30px;
                margin-top: 30px;
                }

    #navicons li    {
                display: inline;
                margin-left: 20px;
                }

    #main-logo  {
                margin-left: 100px;
                margin-top: 40px;
                }

    #feature    {
                width: 1020px;
                height: 546px;
                background-image: url('images/sunburst_bg.jpg');
                /** border-right: 9px solid black;
                border-left: 9px solid black;
                border-bottom: 9px solid black; **/}

    #feature-border {
                width: 1002px;
                height: 538px;
                border-right: 9px solid black;
                border-left: 9px solid black;
                border-bottom: 9px solid black;
                }

我尝试删除谷歌字体链接 - 没有变化。还要确保html和css文件都是utf-8。在普通的董事会周围,但我在以前的问题中没有看到这个问题。

...谢谢

0 个答案:

没有答案