div部分的背景有不明原因的填充,为什么?

时间:2013-09-17 21:53:19

标签: php html css background padding

好的,我花了几天时间试图弄清楚为什么这不起作用,到目前为止谷歌没有给我任何使用。也许有一个内置的规则,我只是不知道。我讨厌在这样的网站上发帖,问题可能是微不足道的,但我已经筋疲力尽了。

所以我在CSS中放置了一个背景,它适用于alotted标签,但它添加了一些未指定的填充。试图改变它什么也没做。身体的背景延长了屏幕的持续时间,但不是这个。

这是包含标题的位置。

<?php
    require_once 'classes/Membership.php';
    $membership = new Membership();
    $loggedin = $membership->confirm_loggedin();
    if(!$loggedin){
        ob_start();
        header("Location: http://lolteamrecruiter.com/login.php");
        ob_end_flush();    
    }

?>

<!DOCTYPE html>
<?php

include @ 'header.php';

?>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Login</title>
    </head>
    <body>

    <div id="Login">

        <!--LOGOUT BUTTON -->
        <p>
            Results Page
        </p>
    </div>
    </body>
</html>

这是包含的php文件。

<link href="css/header.css" rel="stylesheet" type="text/css" />

<div id="header">
    <a href="index.php"><img src="css/images/angel.png" height="40px" width="20px"></a> 

    <?php
    require_once 'classes/Membership.php';
    $membership = new Membership();
    $loggedin = $membership->confirm_loggedin();
    if($loggedin){
        echo '    <div id="header-right-account">
    <ul id="nav">
    <li><a href="#">My Account</a>
        <ul>
            <li><a href="#">Edit</a></li>
            <li><a href="#">Tacos</a></li>
            <li><a href="#">Burritos</a></li>
            <li><a href="http://lolteamrecruiter.com/login.php?status=logout">Log Out</a></li>
        </ul>
    </li>
    </ul>
    </div>';

    }else{
     echo '<div id="header-right"><a href="login.php">Log In</a></div>';

    }
    ?>


</div>

这是应用背景的css文件

#header{

    background-image : url(images/black.png); 
    background-repeat : no-repeat; 
    background-size: 100% 100%;
    background-attachment : fixed;  
    background-origin:border-box;
    margin: 0 auto;
    padding: 0;
    top:0;

}

要查看此内容的网站位于http://lolteamrecruiter.com/

3 个答案:

答案 0 :(得分:0)

默认情况下,您的图像与基线对齐,这意味着它下方的间隙是p,g,j等字母下半部分的空间。

试试这个:

#header a img { vertical-align: middle; }

答案 1 :(得分:0)

你的意思是徽标周围的间距?只需将display:block添加到图像中即可。

修改

好的,在身体上添加保证金:0。

答案 2 :(得分:0)

body {
  background-image : url(images/login-box-backg2.png) no-repeat; 
  background-size: 100% 100%;
  background-attachment : fixed;
  margin: 0;
  padding: 0;
}