Ajuda com a página styling

StackOverflow https://stackoverflow.com/questions/1842853

  •  12-09-2019
  •  | 
  •  

Pergunta

Eu tenho a seguinte imagem que está sendo colocado no topo de uma 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>

O problema é que há um pouco de preenchimento que está aparecendo para a esquerda, superior, direita e inferior da imagem. Eu não quero que estofamento lá. Em outras palavras, eu quero o topo imagem estar alinhada com a esquerda e parte superior da página, e para que possa esticar em toda a largura da página. Como posso conseguir isso com um estilo?

Foi útil?

Solução

estilos padrão Alguns dos navegadores dar ao elemento do corpo de um estofamento, e alguns dar-lhe uma margem. Você precisará remover tanto para que a imagem fique rente à janela em todos os navegadores. 

    body { margin: 0; border: 0 }

Outras dicas

Você precisa usar regras de reset CSS para redefinir estilos de navegador, em seguida, construir a partir daí. Eu uso http://meyerweb.com/eric/thoughts/2007 / 05/01 / restauro de Reloaded / 

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

No entanto, se a sua uma imagem que é essencialmente um decoratin de somesort (ie. Não "conteúdo" ou ligados a outra página) eu prefiro usá-lo como uma imagem de fundo no elemento pai.

Por exemplo

# Pseudo-image {height: 100px; largura: 200 px; background: url transparente (path / to / imagem) de rolagem superior no-repeat left;}

Claro que fazê-lo desta forma, você está limitado a exibir a imagem em seu tamanho real e você tem que definir o div a essas mesmas dimensões ou maiores.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top