Question

我遇到的问题是我的CSS文件没有链接到我的PHP文件。我尝试将admin.php文件与我的assets/css/admin/large.css文件相关联，但它没有链接。

这是我的文件树的图片：

admin.php的

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>T4G Data Manager</title>

        <!-- META DATA -->
        <!-- for ie -->
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <!-- for responsive design -->
        <meta name="viewport" content="width=device-width">
        <!-- for seo -->
        <meta name="author" content="">

        <!-- FONT-AWESOME -->
        <!-- development -->
        <link rel="stylesheet" href="assets/css/libs/font-awesome_development.css">
        <!-- production -->
        <!-- <link rel="stylesheet" href="assets/css/libs/font-awesome_production.min.css"> -->

        <!-- STYLESHEETS -->
        <link rel="stylesheet" href="assets/css/admin/large.css" media="(min-width: 800px)">
        <!-- <link rel="stylesheet" href="assets/css/admin/medium.css" media="(min-width: 301px) and (max-width: 799px)">
        <link rel="stylesheet" href="assets/css/admin/small.css" media="(max-width: 300px)"> -->

        <!-- FONTS -->
        <link href="https://fonts.googleapis.com/css?family=Lato|Open+Sans:600" rel="stylesheet">
    </head>
    <body>

        <nav>
            <ul>
                <li><a href="index.php">Home</a></li>
                <li><a href="backend/logout.php">Logout</a></li>
            </ul>
        </nav> <!-- END OF NAV -->

        <div class="container">

            <section class="edit">
                <div class="students input_data">
                    <h2>Edit Students</h2>

                    <form class="edit_students" action="backend/func/add_student.php" method="post">
                        <input type="text" name="student_id" placeholder="Student ID...">
                        <input type="text" name="first_name" placeholder="First Name...">
                        <input type="text" name="last_name" placeholder="Last Name...">
                        <input type="text" name="grade" placeholder="Grade...">

                        <button type="submit" name="add">Add</button>
                    </form>
                </div> <!-- END OF EDIT STUDENTS -->

                <div class="teachers input_data">
                    <h2>Edit Teachers</h2>

                    <form class="edit_students" action="backend/func/add_teachers.php" method="post">
                        <input type="text" name="first_name" placeholder="First Name...">
                        <input type="text" name="last_name" placeholder="Last Name...">

                        <button type="submit" name="add">Add</button>
                    </form>
                </div> <!-- END OF EDIT TEACHERS -->

                <div class="drivers input_data">
                    <h2>Edit Drivers</h2>

                    <form class="edit_students" action="backend/func/add_drivers.php" method="post">
                        <input type="text" name="first_name" placeholder="First Name...">
                        <input type="text" name="last_name" placeholder="Last Name...">
                        <input type="text" name="phone" placeholder="Phone...">
                        <input type="text" name="team_id" placeholder="Team ID...">

                        <button type="submit" name="add">Add</button>
                    </form>
                </div> <!-- END OF EDIT DRIVERS -->

                <div class="teams input_data">

                </div> <!-- END OF EDIT GROUPS -->
            </section> <!-- END OF SECTION -->

            <aside class="menu">
                <ul>
                    <li><a href="JavaScript:void(0)">Edit Students</a></li>

                    <li><a href="JavaScript:void(0)">Edit Teachers</a></li>

                    <li><a href="JavaScript:void(0)">Edit Drivers</a></li>

                    <li><a href="JavaScript:void(0)">Edit Teams</a></li>
                </ul>
            </aside> <!-- END OF MENU -->

        </div> <!-- END OF CONTAINER -->

        <!-- JQUERY -->
        <!-- production -->
        <!-- <script src="assets/js/libs/jquery_production.min.js" charset="utf-8"></script> -->
        <!-- development -->
        <script src="assets/js/libs/jquery_development.js" charset="utf-8"></script>

        <!-- MAIN -->
        <script src="assets/js/main.js" charset="utf-8"></script>
    </body>
</html>

large.css

/*UNIVERSAL*/
* {
    margin: 0;
    padding: 0;
}

*::selection {
    background-color: #ffffaa;
}

/*CONTAINER*/
.container {
    width: 80%;
    margin: 0 auto;
}

/*NAV*/
nav {
    width: 100%;
    background-color: #eee;
}

nav ul {
    list-style: none;
}

nav li {
    display: inline-block;
    padding: 10px;
    transition: all 200ms ease-in-out;
}

nav li:nth-child(2) {
    float: right;
}

nav li:nth-child(2):hover {
    background-color: #fff;
}

nav a {
    color: #333;
    font: 400 1em Lato;
    text-decoration: none;
}

nav a:nth-child(1) {
    color: #333;
    font: 600 1em Open Sans;
    text-decoration: none;
}

/*MENU*/
.menu {
    padding: 20px;
    background: #333;
}

Answer 1

我必须这样做：

<link rel="stylesheet" href="/assets/css/admin/large.css" media="(min-width: 800px)">

css文件未链接

1 个答案: