鏈接填充整個頁面

我有一個按鈕，這是一個鏈接，在CSS中定義的背景圖像。該鏈接不可見，並且沒有文本，因爲該按鈕具有所有圖形。我的問題是，鏈接（不是圖像，只是看不見的鏈接）以100％的寬度擴展並填充整個屏幕，除了高度。鏈接填充整個頁面

完整樣式表。不要介意一些類和ID，它們是用於其他頁面的！

body { 
background-image: url("background.jpg"); 
font: 0.9em verdana, sans-serif; 
} 
#Upload { 
    width: 30em; 
    margin:auto; 
    margin-top:10%; 
    padding:0 3em 2em 2em ; 
    border:1px solid #bbb; 
    color: #333; 
    background:white; 
    font: 0.9em verdana, sans-serif; 
    border-radius:10px; 
} 
#Upload label{ 
    float: left; 
    width: 7em; 
} 
#Upload a:link { 
text-decoration:none; 
font-size: 15px; 
color:grey; 
}#Upload a:hover{ 
text-decoration:none; 
font-size: 15px; 
} 
#Upload a:visited { 
text-decoration:none; 
color: black; 
font-size: 15px; 
} 

.image{ 
background-color: white; 
margin:auto; 
border: 3px solid #bbb; 
border-radius:10px; 
} 
.container{ 
width:100%; 
} 
a { 
font-weight: bold; 
text-decoration: none; 
} 
.button_skip{ 
background-image:url('button_upload.jpg'); 
background-repeat: no-repeat; 
border-radius:10px; 
border: 1px solid black; 
width:190px; 
height: 35px; 
text-align: center; 
line-height: 35px; 
color:black; 
margin:auto; 
position:relative; 
} 
.button_home{ 
background-image:url('button_upload.jpg'); 
background-repeat: no-repeat; 
border-radius:10px; 
border: 1px solid black; 
width:190px; 
height: 35px; 
text-align: center; 
line-height: 35px; 
color:black; 
margin:auto; 
position:relative; 
} 
.button_upload{ 
background-image:url('upload.png'); 
background-repeat: no-repeat; 
width:272px; 
height:107px; 
border: 3px solid black; 
border-radius:20px; 
overflow:hidden; 
} 
.box{ 
width:272px; 
display:BLOCK; 
} 


HTML (includes some php, it might cause the problem, dunnae) 
<!DOCTYPE HTML> 
<html> 
<head> 
<title>derp</title> 
    <script src="cookie_image.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
    document.onReady=function(){ 
    setCookie("cookie_image", 
    }; 
    </script> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"> 
</head> 
<body> 
<?php 
function getImagesFromDir($path) { 
    $images = array(); 
    if ($img_dir = @opendir($path)) { 
     while (false !== ($img_file = readdir($img_dir))) { 
      // checks for gif, jpg, png 
      if (preg_match("/(\.gif|\.jpg|\.png)$/", $img_file)) { 
       $images[] = $img_file; 
      } 
     } 
     closedir($img_dir); 
    } 
    return $images; 
} 

function getRandomFromArray($ar) { 
    // Hvis der ikke er vist billeder før er cookien ikke sat, så vi sætter den og returnerer 
    if (! array_key_exists('cookie_image', $_COOKIE)) { 
     $num = array_rand($ar); 
     // Husk lige at sætte cookie, ups 
     setcookie("cookie_image", $num, time() + 86400); 
     return $ar[$num]; 
    } 
    // Hvis cookie er sat har billeder været vist før så vi får ingen fejl 
    mt_srand((double)microtime() * 1000000); // php 4.2+ not needed 
    $num = array_rand($ar); 
    $last_image = explode(",", $_COOKIE["cookie_image"]); 
    if (is_array($last_image)==false){ 
     $last_image = array(""); // HER DET ARRAY DER BLIVER GENERATED SOM LAVER EN ERROR HVIS DER IKKE ER NOGET I 
    } 
    while(sizeof ($last_image)< sizeof ($ar) and in_array($num, $last_image)){ 
     $num = array_rand($ar); 
    } 
    if (sizeof ($last_image)< sizeof ($ar)) { 
     array_push($last_image, $num); 
    } else { 
     $last_image = array(); 
    } 
    setcookie("cookie_image", implode (",", $last_image), time() + 86400); 
    //setcookie("cookie_image", "", time()+86400); 
    return $ar[$num]; 
} 



///////////////////////////////////////////////////////////////////// 
// This is the only portion of the code you may need to change. 
// Indicate the location of your images 

$root = ''; 
// use if specifying path from root 
//$root = $_SERVER['DOCUMENT_ROOT']; 

$path = 'uploaded_files/'; 

// End of user modified section 
///////////////////////////////////////////////////////////////////// 

// Obtain list of images from directory 
$imgList = getImagesFromDir($root . $path); 
$img = getRandomFromArray($imgList); 
?> 
<div class="container"> 

     <div class="button_upload_box"> 
<a href="upload.php" target="_self"> 
<div class="button_upload"> 
</div> 
</a> 

<div> 
     <center><br><br> 
<img style="max-width:600px; max-height:300px; min-width=100px; min-height:10px;" class="image" src="<?php echo $path . $img ?>" alt="Derp"> 
<br><br><br><br><br><br> 
     </center> 
     </div> 
     <a href="index.php" target="_self"> 
     <div class="button_skip"> 
     Skip this image 
     </div> 
</a> 
    </div> 
</body> 
</html>

來源

2012-09-27 Pascal Kordon

這是生活在任何地方，所以我們可以看到它在一個更標準化的設置轉載？ – Mutmatt