Bienvenido a la Comunidad de Treehouse

¿Quieres colaborar en errores de código? ¿Tienes errores que necesitan comentarios? ¿Buscas un par de ojos adicionales en tu último proyecto? aquí.

¿Buscas aprender algo nuevo?

Treehouse ofrece una prueba gratuita de siete días para estudiantes nuevos. Obtén acceso a miles de horas de contenido y únete a miles de

Inicia tu prueba gratuita

CSS Mejora del Diseño con CSS Imágenes de Fondo Imágenes de Fondo

Publicado por Marcus Pham
Marcus Pham
1,765 puntos

A continuación, define la propiedad y el valor de fondo que evita que una imagen de fondo se repita en ninguna dirección

style.css 
.vida silvestre{
  background-image:url(img/bear.jpg)


}
index.html 
<!DOCTYPE html>
<html>
  <head>
    <title>Lake Tahoe</title>
    <link rel=stylesheet href=page.css>
    <link rel=stylesheet href=style.css>
  </head>
  <body> 
        <div class=primary-content t-border>
            <p class=intro>
                Lake Tahoe es uno de los atractivos más impresionantes ubicados en California. Es el hogar de varios centros de esquí, recreación al aire libre en verano y atracciones turísticas. La nieve y el esquí son una parte significativa de la reputación del área.
            </p>
            <a class=destacado href=#más>Descubre más</a>
      <div class=vida silvestre>
        <h2>Mira toda la Vida Silvestre</h2>
        <p>
          A medida que se acerca la temporada de desove, los peces adquieren una joroba y una mandíbula saliente. Después del desove, mueren y sus cadáveres proporcionan un festín para reuniones de <a href=#visón>visón</a>, <a href=#osos>osos</a>y <a href=#águilas>águilas calvas</a>.
        </p>
      </div><!-- End .vida silvestre -->
            <a class=destacado href=#vida silvestre>Ve la Vida Silvestre</a>
        </div><!-- Fin .contenido-principal -->
  </body>
</html>
Tim Stride
Tim Stride
14,489 Puntos
Tim Stride
Tim Stride
14,489 Puntos

Para evitar que la imagen se repita en absoluto, establece la background-repeat propiedad en no-repeat. También probablemente necesites incluir comillas alrededor de la ruta del archivo de la imagen en la url propiedad:

.vida silvestre{
  background-image: url(img/bear.jpg);
  background-repeat: no-repeat;

}

Aquí está el enlace a la referencia de Mozilla Developer sobre el background-repeat .