mozilla
Os seus resultados da pesquisa

    background-position

    Resumo

    background-position configura a posição inicial de qualquer imagem de fundo que seja configurada.

    • Valor inicial: 0% 0%
    • Aplica-se a: todos os elementos
    • Herdado: não
    • Porcentagens: refere-se ao tamanho da própria caixa
    • Mídia: visual
    • Valor computado: para <length> o valor absoluto, se não uma porcentagem

    Sintaxe

    background-position: [ [ <percentage> | <length> | left | center | right ] [ <percentage> | <length> | top | center | bottom ]? ] | [ [ left | center | right ] || [ top | center | bottom ] ] | inherit
    

    Valores

    <percentage> <percentage>
    Com um par de valores de '0% 0%', o canto superior esquerdo da imagem é alinhado com o canto superior esquerdo do enchimento da borda da caixa. Um par de valores de '100% 100%' coloca o canto inferior direito da imagem no canto inferior direito da área de enchimento. Com um par de valores de '14% 84%', o ponto de 14% na horizontal e 84% na vertical da imagem é colocado no ponto 14% na horizontal e 84% na vertical da área de enchimento.
    <length> <length>
    Com um par de valores de '2cm 1cm', o canto superior esquerdo da imagem é colocado 2cm para a direita e 1cm abaixo do canto superior esquerdo da área de enchimento.
    top left e left top
    O mesmo que '0% 0%'.
    top, top center e center top
    O mesmo que '50% 0%'.
    right top e top right
    O mesmo que '100% 0%'.
    left, left center e center left
    O mesmo que '0% 50%'.
    center e center center
    O mesmo que '50% 50%'.
    right, right center e center right
    O mesmo que '100% 50%'.
    bottom left e left bottom
    O mesmo que '0% 100%'.
    bottom, bottom center e center bottom
    O mesmo que '50% 100%'.
    bottom right e right bottom
    O mesmo que '100% 100%'.

    Se somente um valor é especificado, então ele configura a posição horizontal, com a posição vertical em 50%. Caso contrário, o primeiro valor especifica a posição horizontal. Combinações são permitidas de valores de palavras-chave, comprimento ou porcentagens, mas se palavras-chave forem misturadas com outros valores, 'left' e 'right' podem somente ser usados como o primeiro valor, e 'top' e 'down' podem somente ser usados como o segundo valor. Posições negativas são permitidas.

    Exemplos

    .exampleone {
    	background-image: url("logo.png");
    	background-position: top center;
    }
    
    .exampletwo {
    	background-image: url("logo.png");
    	background-position: 25% 75%;
    }
    
    .examplethree {
    	background-image: url("logo.png");
    	background-position: 2cm bottom;
    }
    
    .examplefour {
    	background-image: url("logo.png");
    	background-position: center 10%;
    }
    
    .examplefive {
    	background-image: url("logo.png");
    	background-position: 2cm 50%;
    }
    
    

    == Notas ==

    Especificações

    Compatibilidade com navegadores

    Navegador Versão mais antiga
    Internet Explorer 4
    Firefox 1
    Netscape 6
    Opera 3.5

    Veja também

    background, background-attachment, background-color, background-image, background-position, background-repeat

    Categorias

    Interwiki Language Links

    Etiquetas do documento e colaboradores

    Etiquetas: 
    Contributors to this page: Verruckt, teoli
    Última atualização por: teoli,