Question

CSS文件在不同页面上的工作方式不同，为什么？

我已将css文件链接到我的所有网页样式，但它在某些页面上的工作方式不同，它在我的新login.php页面上更改了布局外观，但是它在index.php页面上工作得很好，我似乎不理解错误的逻辑。

我在上面描述的所有页面的代码下面。

下面的文件是header.php，其中包括我的每一页

<?php 
if (!isset($layout_context))
    {
        $layout_context = "public";
    }
 ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <title>Widget Corp <?php if ($layout_context == "admin") { echo "Admin"; } ?></title>
    <link href="stylesheets/public.css" media="all" rel="stylesheet" type="text/css" />    
</head>
<body>
<div id="header">
    <h1>Widget Corp <?php if ($layout_context == "admin") { echo "Admin"; } ?></h1>
</div>

下面的代码是CSS文件本身，名称为public.css：

@charset "utf-8";
/* 
#EEE489 - Light Tan
#8D0D19 - Burgundy
#1A446C - Blue Grey
#D4E6F4 - Very Light Blue
#689DC1 - Light Blue
*
{
    margin: 0;
    padding: 0;
}

*/

body
{
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 15px;
    background: #EEE489;
}

img
{
    border: none;
}

a
{
    color: #8D0D19;
}

a:hover
{
    color: #1A446C;
}

#header
{
    height: 70px;
    margin: 0;
    padding: 0;
    text-align: left;
    background: #1A446C;
    color: #D4E6F4;
}

#header h1
{
    padding: 1em;
    margin: 0;
}

#main
{
    height: 600px;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #EEE4899;
    position: relative;
}

#footer
{
    clear: both;
    height: 2em;
    margin: 0;
    padding: 1em;
    text-align: center;
    background: #1A446C;
    color: #D4E6F4;
}

/* Navigation */
#navigation
{
    float: left;
    width: 150px;
    height: 100%;
    margin: 0;
    color: #D4E6F4;
    background: #8D0D19;
    padding-top: 0;
    padding-right: 2em;
    padding-bottom: 0;
    padding-left: 2em;
    position: relative;
}

#navigation a
{
    color: #D4E6F4;
    text-decoration: none;
}

#navigation a:hover
{
    color: #FFFFFF;
}

ul.subjects
{
    margin: 1em 0;
    padding-left: 0;
    list-style: none;
}

ul.pages
{
    padding-left: 2em;
    list-style: square;
    font-weight: normal;
}

.selected
{
    font-weight: bold;
}

/* Page Content */
#page
{
    float: left;
    height: 100%;
    padding-left: 2em;
    vertical-align: top;
    background: #EEE489;
    /*position: relative; */
}

#page h2
{
    color: #8D0D19;
    margin-top: 1em;
}

#page h3
{
    color: #8D0D19;
}

.view-content
{
    margin: 1em;
    padding: 1em;
    border: 1px solid #999999;
}


div.message
{
    border: 2px solid #8D0D19;
    color: #8D0D19;
    font-weight: bold;
    margin: 1em 0;
    padding: 1em;
}

.error
{
    color: #8D0D19;
    border: 2px solid #8D0D19;
    margin = 1em 0;
    padding = 1em;
}

.error ul
{
    padding-left: 2em;
}

下面的代码是我的index.php，工作正常。

<?php require_once("../includes/session.php") ?>
<?php require_once("../includes/db_connection.php") ?>
<?php require_once("../includes/functions.php") ?>
<?php $layout_context = "public"; ?>
<?php include("../includes/layouts/header.php") ?>
<?php find_selected_page(true); ?>
<div id="main">
    <div id="navigation">
        <?php echo public_navigation($current_subject, $current_page); ?>
        <a href="new_subject.php">+ Add a subject</a>
    </div>
    <div id="page">
        <?php if ($current_page) { ?> 
            <h2><?php echo htmlentities($current_page["menu_name"]); ?></h2>
            <?php echo nl2br(htmlentities($current_page["content"])); ?>
        <?php } else { ?> 
            <p>Welcome!</p>
        <?php } ?>
        <br />
        <a href="login.php">Login</a>
    </div>
</div>
<?php include("../includes/layouts/footer.php") ?>

下面的代码是名为login.php的文件，现在我不知道我的css样式表有什么问题正在改变布局。

<?php require_once("../includes/session.php"); ?>
<?php require_once("../includes/db_connection.php"); ?>
<?php require_once("../includes/functions.php"); ?>
<?php require_once("../includes/validation_functions.php"); ?>
<?php
    $username = "";

    if (isset($_POST['submit']))
    {
        // validations
        $required_fields = array("username", "password");           
        validate_presences($required_fields);

        if (empty($errors))
            {
                // Attempt Login
                $username = $_POST["username"];
                $password = $_POST["password"];

                $found_admin = attempt_login($username, $password);

                if ($found_admin)
                {
                    // Success
                    // Mark user as logged in
                    $_SESSION["admin_id"] = $found_admin["id"];
                    $_SESSION["username"] = $found_admin["username"];
                    redirect_to("admin.php");
                } 
                else
                {
                    // Failure
                    $_SESSION["message"] = "Username/Password not found.";
                }
            }       
    } 
    else
    {
    }
?>
<?php $layout_context = "admin"; ?>
<?php include("../includes/layouts/header.php"); ?>
<div id="main">
    <div id="navigation">
        &nbsp;
    </div>
    <div id="page">
        <br />
        <?php echo message(); ?>
        <?php echo form_errors($errors); ?>

        <h2>Login</h2>
        <form action="login.php" method="post">

            <p>Username:
                <input type="text" name="username" value="<?php echo htmlentities($username); ?>" />
            </p>

            <p>Password:
                <input type="password" name="password" value="" />
            </p>

            <input type="submit" name="submit" value="Submit" />
        </form>
    </div>
</div>
<?php include("../includes/layouts/footer.php"); ?>

布局与我链接的相同css文件不同

0 个答案: