Pregunta

Tengo la siguiente imagen que se coloca en la parte superior de una página.

<body>
    <form id="form1" runat="server" >
    <div>
        <div>
            <img src="Images/top.png" width="100%" height="115px" alt="top.png" />
        </div>
    </div>
    </form>
</body>

El problema es que hay un poco de relleno que está apareciendo a la izquierda, arriba, derecha, y la parte inferior de la imagen. No quiero que el relleno no. En otras palabras, quiero la parte superior de imagen se deben a ras de la izquierda y la parte superior de la página, y para que se estire a lo ancho de la página. ¿Cómo puedo lograr esto con un estilo?

¿Fue útil?

Solución

Algunos estilos por defecto de los navegadores dan el elemento del cuerpo de un relleno, y algunos que dan un margen. Tendrá que eliminar tanto, para que la imagen sea al ras de la ventana gráfica en todos los navegadores.

    body { margin: 0; border: 0 }

Otros consejos

Es necesario utilizar reglas CSS reset para restablecer estilos del navegador, y luego construir a partir de ahí. Yo uso http://meyerweb.com/eric/thoughts/2007 / 05/01 / reset-recargado /

<img style="display: block; padding: 0; margin: 0;" ... />

Sin embargo, si su una imagen que es esencialmente un decoratin de somesort (es decir. No "contenido" o vinculados a otra página) Yo prefiero usar una imagen de fondo en el elemento padre como.

Por ejemplo

    # Pseudo-imagen {height: 100px; anchura: 200 píxeles; background: url transparente (ruta / a / imagen) desplazarse arriba a la izquierda no-repeat;}      

Por supuesto, haciendo de esta manera que se limitan a mostrar la imagen en su tamaño real y hay que establecer el div a esas mismas dimensiones o más grandes.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top