Question

我有以下代码：

＆＃13;

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Accueil</title>

    <link rel="stylesheet" href="css/header-search.css" />
    <link rel="stylesheet" href="css/header.css" />

</head>

<body>

    <header class="header-two-bars">

        <div class="header-first-bar">
            <div class="header-limiter">
                <h1><a href="#">Jeannot<span>Boutique</span></a></h1>

                <div class="member-area-buttons">
                    <a href="form-register.html" class="signup-button">Sign Up</a>
                    <a href="form-login.html" class="login-user">Log In</a>
                </div>


                <div class="container-1">
                    <span class="icon"><i class="fa fa-search"></i></span>
                    <input type="search" id="search" placeholder="Search..." />
                </div>
            </div>

            <div class="clear"></div>
        </div>

        <div class="header-second-bar">
            <div class="header-limiter">
                <nav>
                    <a href="#"><i class="fa fa-male"></i> Accueil</a>
                    <a href="#" class="selected"><i class="fa fa-female"></i> Chaussures</a>
                    <a href="#"><i class="fa fa-folder-o"></i> Vêtements</a>
                    <a href="#"><i class="fa fa-pencil"></i> Accessoires</a>
                    <a href="#"><i class="fa fa-check"></i> Sur mesure</a>
                    <a href="#" style="color: pink;"><i class="fa fa-pencil"></i> Blog</a>
                    <a href="#" style="color: pink;"><i class="fa fa-check"></i> Promo</a>
                </nav>
                <div class="nav-social-media">
                    <a href="#" style="background-color:#3b5998;"><i class="fa fa-facebook"></i></a>
                    <a href="#" style="background-color:#55acee;"><i class="fa fa-twitter"></i></a>
                    <a href="#" style="background-color:#dd4b39;"><i class="fa fa-google-plus"></i></a>
                    <a href="#" style="background-color:#125688;"><i class="fa fa-instagram"></i></a>
                </div>
                <div class="clear"></div>
            </div>
        </div>

    </header>
</body>

＆＃13;

基本上，我有一个我的css文件所在的文件夹。当我从css文件夹加载文件header.css时，它没有任何效果，但一旦与index.html位于同一位置，一切都很完美。

我一直在努力寻找答案，但没办法。我的文件系统结构如下：

请帮助我找出我的代码有什么问题。

PS：我使用过W3验证器，一切正常。

Answer 1

https://stackoverflow.com/a/9480801

添加
{{1}}
到你的链接标签

虽然在现代浏览器中HTML4可能不再需要这样做   规范声明这是一个必需的属性。

你可以试试这个：

指定href =“./ style.css”中的哪个。指定当前目录

Answer 2

使用

<link rel="stylesheet" href="/css/header-search.css" />
<link rel="stylesheet" href="/css/header.css" />

而不是

<link rel="stylesheet" href="css/header-search.css" />
<link rel="stylesheet" href="css/header.css" />

处于特定文件夹中时未加载CSS文件

2 个答案: