problemas con mi web

hey que tal, este correo lo envio desde la vispera de NAVIDAD, asi que FELIZ NAVIDAD, bueno pasando a cosaas mas serias, tengo un problema con mi web, ya subi la pagina de prueva y todo pero lo que es la imagen me da un enlace y una presentacion que no me gusta, no se si me di a explicar, asi que les pongo mejor lo que he echo

en la plantilla html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<title>TEATRO DE VIDA</title>
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera"><div id="logotipo"><a href="index.html">[contenido no disponible]
</div>
<div id="publicidad">Bienvenidos a mi Web</div>
<div id="navegacion">Barra de Navegación</div>
<div id="contenido"><div id="menu">
<ul>
  • enlace 1
  • enlace 2
  • enlace 3

    </div><h1>Esta será la zona principal de la web</h1>
    <h2>este es el segundo parrafo</h2>


    Ya sabemos que gracias a la Hoja de Estilos, podemos cambiar el tamaño de la letra de toda la web, podemos varias los aspectos de los enlaces, los fondos de ciertos elementos, etc, etc sin más que poner la propiedad correspondiente. Pero para eso, todas las partes del contenido de la página web deben "ser algo". Si son enlaces modificaremos la etiqueta "a", si son párrafos la etiqueta "p", pero, qué etiqueta hemos de modificar para cambiar las propiedades del texto de la parte principal de nuestra plantilla? Aquella en la que pone "Esta será la zona principal de la web"?</p></div>
    <div id="pie">Este es el pié de página</div>
    <div id="curva-inferior"></div>
    </div>
    </body>
    </html>

    y en estilo-general.css:

    * {margin:0px ; padding:0px ; border: 0px}
    body {text-align: center; background-color: #BEBEBE}
    #global {width:800px ; margin: 4px auto }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat; width: 800px; height: 12px; overflow : hidden }
    #cabecera {background-color: white; border-left: black 1px solid ; border-right: black 1px solid; height:85px}
    #logotipo {width:280px; float:left }
    #publicidad {width:518px; float:right; margin-top:25px }
    #navegacion {background-color: gray; border: black 1px solid }
    #contenido {background-color: orange ; border-left: black 1px solid ; border-right: black 1px solid }
    #contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px}
    #menu {background-color: yellow; width: 150px ; float:left; text-align:left; margin-right: 10px }
    #menu li { list-style:none; margin: 4xp 0xp 4xp 6xp}
    #pie { background-color: white; border-left: black 1px solid; border-right: black 1px solid; border-top: black 1px solid }
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat; width:800px; height: 12px; overflow: hidden }
    a {color: black; font-size:1.3em ; text-decoration: none}
    a:link {}
    a:visited {}
    a:hover {color:red; text-decoration:underline; background-color: silver}
    a:active {}
    p {text-align: justify}
    h1 {font-size: 1.2em; color: blue; font-weighe: bold; text-decoration: underline; text-align: center}
    h2 {font-size: 1.1em; color: blue; font-weighe: bold; text-decoration: none; text-align: center}

    la verdad no se si esta bien, por eso les pido que lo chequen, y esto es lo que sale en la paguina con todo lo anterior: http://teatro.onlinewebshop.net/plantilla.html

    si deslizan el cursor sobre la imagen prinsipal, notaras que es un enlace con fondo gris (fondo que no quiero) y la cabesera y la barra de navegacion, estan dentro del mismo enlase (de igual fomra no quiero eso solo la imagen como enlase), asi que ¿que tengo que correguir para que salga bien?.
    de antemano se los agradesco, y pàsensela chido
  • La verdad nunca trabajé con enlaces que tuviesen un background-color.

    Antes de nada, una pregunta, para sacar el background-color a determinado enlace, qué valor se le da en el código css? background-color:none? En ese caso yo probaría agregando esto a tu hoja de estilos:

    img a:hover {background-color:none}

    Con lo que puse arriba modificas el estado hover de las imágenes que contienen un enlace.

    Saludos ;)
    De antemano gracias por la respuesta anterior, pero la cosa no es esa, si no que los unico enlace que quiero que alla son los de menu y el logotipo, pero en mi pag web el enlace del logotipo afecta las palabras "barras de navegacion" y "bienbenido a mi web", algo que no quiero que suseda
    Parte del código que tienes puesto es este:
    <div id="cabecera"><div id="logotipo"><a href="index.html">[img]objetos/logotipo.gif[/img] 
    </div>
    Te faltan unos cierres de elementos </div></a> sustituye el código de arriba por este otro:

    <div id="cabecera"><div id="logotipo">[url="index.html"][img]objetos/logotipo.gif[/img][/url]</div> 
    </div>

    Haber si así se te soluciona.