Como mudar fundos repetitivas em sites css3

Video: STEAM: Personalizar Plano de Fundo Perfil Steam (Emenda c/ Destaque de artes)

Há situações em que você só quer uma única cópia de uma imagem de fundo em seu site CSS3. Pode ser que a imagem que usei é algo que não se repita bem ou é grande o suficiente para que você realmente não quer que ele repetiu. O procedimento a seguir demonstra uma técnica que você pode usar para dizer ao navegador para utilizar apenas uma cópia de uma imagem de fundo.

1. Abra o BackgroundPosition.CSS Arquivo.

2. Modificar o estilo de corpo para que a imagem não se repita, como mostrado aqui.

   body {background-image: url ("CuteCat.jpg") -background-color: SaddleBrown-color: SeaGreen-font-size: x-large-text-shadow: 1px 1px-background-position Amarelo: centro-background-attachment:-background-repeat fixo: no-repeat-background- size: 80% -}

   A propriedade background-repeat está definido para no-repeat para que o navegador sabe para exibir apenas uma cópia. Porque há apenas uma cópia e a imagem pode não ser o tamanho certo para fornecer uma boa apresentação quando o usuário redimensiona o navegador, você também deve definir a propriedade background-size para redimensionar a imagem automaticamente.

3. Salve o arquivo CSS como NoRepeat.CSS.

4. Abra o arquivo BackgroundPosition.HTML.

5. modificar o tag para que ele se parece com isso:

6. Salve o arquivo HTML como NoRepeat.HTML.

7. Carregar a página NoRepeat.

   Você vê o fundo. Há apenas uma imagem no centro agora - e quando você redimensionar o navegador, a imagem redimensiona automaticamente também.