Problem mit Verlinkung des header-Hintergrundbildes

crackyack

Mitglied

Dabei seit: 22.03.2009

Beiträge: 48

Samstag, 4. April 2009, 18:16

Hallo,
ich möchte den Header auf eine andere Seite verlinken.
Nun weiß ich nicht wie ich es mache

Quellcode

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    	"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
       	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
       	<title>was wei&szlig; ich?!</title>
<style type="text/css" media="screen">
    	body
    	{
             	margin: 0;
             	padding: 0;
             	font: 85% arial, hevetica, sans-serif;
             	text-align: center;
             	background-color: #ABABAB;
    	}

    	a:link { color: #B52C07; }
		a:visited { color: #600; }

		a:hover, a:active
		{
				color: #fff;
				background-color: #B52C07;
		}

		h2
		{
				color: #B52C07;
				font: 120% georgia, times, "times new roman", serif;
				font-weight: bold;
				margin: 0 0 2px 0;
		}

		h2 a { text-decoration: none; }

		h3
		{
				color: #CD2626;
				font: 106% georgia, times, "times new roman", serif;
				font-weight: bold;
				margin-top: 0;
		}

    	#container
    	{
             	margin: 1px auto;
             	width: 940px;
             	text-align: left;
             	background-color: #fff;
             	border: 1px solid #676767;
    	}

    	#header
    	{
             	height:180px;
             	background-image: url(benny.png);
				 background-repeat: no-repeat;
				 background-position: 0 0;
				 position: relative;

    	}

    	#mainnav
    	{

             	background-color: #CD2626;
             	color: #8B0000;
             	padding: 2px 0;
             	margin-bottom: 22px;
    	}

    	#mainnav ul
    	{
             	margin: 0 0 0 20px;
		   		 padding: 0;
				 list-style-type: none;
				 border-left: 1px solid #8B0000;
		}

    	#mainnav li
		{
				display: inline;
				padding: 0 10px;
				border-right: 1px solid #8B0000;
		}

    	#mainnav li a
		{
				text-decoration: none;
				color: #8B0000;
    	}

    	#mainnav li a:hover
		{
		 		text-decoration: none;
		 		color: #fff;
		}

    	#menu
    	{
             	float: right;
             	width: 350px;
             	border-left: 1px solid #8B0000;
             	padding-left: 15px;
    	}

    	#menu ul
		{
				margin-left: 0;
				padding-left: 0;
				list-style-type: none;
				line-height: 165%;
		}


    	#contents
    	{   	margin: 0 400px 40px 20px; }


    	#contents p
    	{   	line-height: 165%; }

    	.blogentry
    	{   	border-bottom: 1px solid #8B0000; }


		#footer
		{
	         	clear: both;
	         	color: #272900;
		     	background-color: #CD2626;
		     	text-align: center;
		     	padding: 5px;
		     	font-size: 90%;
		}
</style>
</head>
<body>

<div id="container">

<div id="header"></div>

<div id="mainnav">
  <ul>
	<li><a href="#">Home</a></li>
	<li><a href="#">Biographie</a></li>
	<li><a href="#">Projekte</a></li>
	<li><a href="#">Impressum</a></li>
  </ul>
</div>

<div id="menu">
  <h3>Menu</h3>
  <ul>
	<li>Section1</li>
	<li>Section2</li>
	<li>Section3</li>
	<li>Section4</li>
  </ul>
</div>

<div id="contents">
  <div class="blogentry">
	<h2>Herzlich Willkommen auf meiner privaten Homepage</h2>
	<p>Test Test Test Test Test Test</p><p>Test Test Test Test Test Test</p>
	<p>Test Test Test Test Test Test</p><p>Test Test Test Test Test Test</p>
	<p>Test Test Test Test Test Test</p><p>Test Test Test Test Test Test</p>
	<p>Test Test Test Test Test Test</p><p>Test Test Test Test Test Test</p>
  </div>
</div>

<div id="footer">
  Copyright &copy; www.my.Programming.de 2009
</div>
</div>
</body>
</html>

Wenn ich bei
<div id="header"></div>
noch ein a und img reinsetze mit dem gleichen Bild, dann würde es zwar funktionieren, aber wenn ich dann über das Bild gehe, erscheint dann ebenfalls ein weißer Rahmen um den header.
Außerdem habe ich dann einen doppelten Rahmen...

Hier könnt ihr auch die Seite haben, wenn ich das a und das img noch reinsetze.
www.detoxmania.info.ms

danke im Vorraus

jumps

Tripel-As

Dabei seit: 24.02.2009

Beiträge: 221

Montag, 6. April 2009, 21:23

Wenn ich dich richtig verstanden habe, möchtest du den div-Container #header auf eine andere Seite verlinken? D.h. wenn man auf das Bild im Container #header klickt, sich eine neue Seite öffnet?
Da man Container an sich nicht verlinken kann, bleibt dir nur die Lösung, das Bild direkt mit <a href="..."><img src=".."></a> zu integrieren und zu verlinken.

Und von was für nem Rahmen redest du da? Wenn du mit der Maus über das Bild fährst erscheint ein Rahmen!?

Du kannst mit CSS ebenfalls das Erscheinungsbild von Links verändern. Schau mal auf www.css4you.de nach.

Zitat

Photoshop machts möglich.