En este quinto tutorial vamos a aprender a manejar la opacidad de la imagen de fondo para la sección de título grande en el tema gratuito Zerif Lite.
Puede que no nos guste el efecto de opacidad y queramos que la imagen tenga su contraste original. Para eso tendremos que añadir el siguiente código a la hoja de estilos (el archivo custom.css) del tema hijo; las instrucciones para crear un tema hijo se encuentran en esta entrada anterior:
.header, .header-content-wrap, .contact-us {
background: rgba(0, 0, 0, 0);
}Tener en cuenta que este código también suprime el efecto de opacidad en la sección Contáctenos.
Para conservarlo, simplemente eliminar el selector .contact-us.
Si no desea eliminar la opacidad, pero sí atenuarla un poco, puede ajustarla cambiando el valor de la última cifra, a algo así:
.header, .header-content-wrap, .contact-us {
background: rgba(0, 0, 0, .3);
}Y si desea aplicar una opacidad de distinto color, cambie los valores RGB. Por ejemplo, para un color que coincida con el rojo de los botones, quedaría algo así:
.header, .header-content-wrap, .contact-us {
background: rgba(233, 102, 86, .3);
}
Una herramienta muy útil para cuando trabajamos con colores, es la que nos ofrece el sitio HEX to RGB Converter: Aquí podemos insertar los valores hexadecimales correspondientes para un color y convertirlos a valores RGB.
¿Qué pasa si nada más queremos aplicar estilos a Zerif Lite, pero sin cambiar nada en los archivos? En este caso, el tema hijo no es necesario, ya que a partir de la versión 4.7 WordPress incluye la opción CSS adicional en el Personalizador, que nos da la posibilidad de pegar los códigos necesarios en el recuadro correspondiente y ver los cambios en el momento. La opción se encuentra al final:
Tutorial original en inglés: How to remove background opacity in Zerif
Técnica en electromecánica, periodista, entusiasta de los idiomas y enamorada de WordPress. Amante del mate, la lectura, la música y las series de sci-fi. Mamá de una vizsla loca.
- Guía para WordPress 6.6 disponible - 22 de septiembre de 2024
- Guía para WordPress 6.5 disponible - 13 de junio de 2024
- Guía para WordPress 6.4 disponible - 5 de diciembre de 2023
Buen día estimada, muy buen aporte de su parte con todo lo que hay en su contenido, Tengo una pregunta, ¿Que código css uso para cambiar el color y el tamaño al texto de las secciones de la pagina de inicio de mi tema Zerif lite?, te agradecería un mundo por tu ayuda, saludos desde Ecuador!!!
Hola, Henry.
Fijate en esta respuesta están todos los códigos correspondientes a las secciones. Para el tamaño, dentro de los selectores, usá
font-size: 16px;(con el valor en píxeles que necesites).Saludos.
Hola buenas tardes, primera vez que uso el tema y me encanta pero tengo un problema quiero cambiar el color de fondo del “navbar” a transparente pero no logro hacerlo… ¿me ayudarian por favor?
Hola, Christofher.
Fijate en esta respuesta.
Saludos.
Hola, hice lo que me decia pero no cambia con ese codigo se vuelve a poner en blanco… que hago?
Hola, Christofher.
El código es correcto. Tenés que pegarlo en el recuadro CSS adicional del Personalizador o en el archivo
custom.csssi estás usando un tema hijo.Saludos.
quiero enviarles una imagen… tengo la version pro del tema… y no puedo al principio me carga el fondo transparente luego se vuelve de nuevo a blanco… como les envio una imagen? necestio ayuda
Hola, Christofher.
Si es Zerif Pro, usá
background: transparent !important.Saludos.
Hola tengo un problema cambio la imagen de fondo la coloco del mismo tamano de la original de 1901×1266 pixeles pero me sale como cortada no se ve completa como hago para que tome la imagen de fondo bien. Sin cortarla?
Hola, Greicy.
Guardá la imagen con un ancho superior. Fijate que el tamaño que recomiendan en la documentación es de 2048×1365 píxeles (para que se vea bien en monitores de resoluciones altas).
Saludos.
Hola Ana. Uso zerif ya instalado al 100% pero no me aparece em móvil la imagen de cabecera. No encuentro que configuración pueda ser la solución. ¿Alguna idea?. Excelentes los tutoriales. Saudos.
Hola, Oscar.
Veo que tenés demasiados plugins y seguramente es alguno que está haciendo conflicto. Desactivalos uno por uno hasta dar con el culpable.
Y por otro lado, tratá de optimizar las imágenes, porque la página tarda muchísimo en cargar. Fijate en el tutorial, se indican las medidas recomendadas.
Saludos.
Ana, eres muy amable. Probaré con lo que comentas. Una vez más, agradezco la realización de estos tutoriales.
Hola de nuevo Ana. Pues ya elimine varios Plugins y reduje drásticamente tamaños de imágenes, sin embargo y aunque tengo el plugin WP Super Cache, la carga aún sigue siendo algo prolongada (y el gris sigue bloqueando la imagen de cabecera en móviles). ¿Recomiendas instalar algún plugin extra para velocidad?
Hola, Oscar.
Veo que es una versión bastante desactualizada del tema, así que algún bug debe haber con respecto a la imagen de fondo.
En cuanto a la velocidad, son varios los factores que influyen, como el servidor y los plugins que tengas activados. El video incrustado también agrega tiempo de carga.
Saludos.
Hi Ana! Comparto las causas ya detectadas y soluciones aplicadas:
Imagen del fondo: Pude al fin hacerla aparecer en el móvil eligiendo en Background Image : Fit to Screen y Repeat Background Image.
Velocidad: No eran los Plugins. Con F12 detectamos que había errores con la hoja de estilos, está llamando contenido sin HTTPS. Así mismo, la Google font del tema: “Lato” estaba dando problemas. Me apoyé con mi proveedor de hosting quien me ayudó a editar el código y aunque no es tan veloz, si mejoró la carga. Muchas gracias por tus respuestas.
Hola! Hoy actualicé a la versión más reciente de Zerif y SANTO REMEDIO. He logrado una carga de 6 segundos. ¡Estoy FELIZ! Fue muy desgastante el proceso y tuve que editar nuevamente algunas secciones, pero ya esta!
buenas noches, he leido mucho tus comentarios.
Me gustaria que me ayudaras a resolver lo siguiente:
1. tengo el tema zerif pro y instalado ,pero quiero cambiar el color de la cabecera donde se ubica el logo y el menú es de color blanco pero quiero cambiarlo a otro color por medio del código css, pero no lo acepta, este codigo fue el coloque
.navbar {
background: #003d6b;
}
en el css adicional. me ayudar porfavor gracias.
Hola, John.
En Zerif Pro podés cambiar los colores desde el personalizador. Para la cabecera es la opción Colores > Colores generales > Color de fondo del menú de navegación.
Saludos.
Hola buenas noches Ana,gracias ya pude cambiar el color.
Pero tengo otra duda podría cambiar el fondo blanco de mis páginas y entradas a otro color y cómo sería .
Y me podrías ayudar con el código CSS para aumentar el tamaño de los logos de clientes gracias
Hola, John.
Para lo primero, fijate en esta respuesta. Y para lo segundo, está este tutorial.
Saludos.
Hola Ana,
instale el codigo
.header, .header-content-wrap, .contact-us {
background: rgba(0, 0, 0, 0);
}
Pero la imagen en la sección Blog no cambia y aparece con el efecto y se ve muy oscura.
Que puedo hacer.
Mil gracias
Hola, Luis.
La clase para esa sección es
.blog-header-content-wrap.Saludos.
Hola, quiero que el fondo de las páginas (donde aparece el texto) en el tema twenty seventeen de wordpress, en vez de ser blanco, sea transparente, a fin de que el texto de las secciones (inicio, servicios, contacto…) se lea sobre la imagen de la cabecera… ¿Es posible? Gracias y felicidades por tu impresionante blog… Me estoy poniendo al día con tus articulos y respuestas a comentarios.
Hola, Alejandro.
Gracias por tu comentario.
En el recuadro
CSS adicionaldel personalizador (u hoja de estilos del tema hijo) pegá el siguiente código:.home .site-content-contain { background: transparent; }Tené en cuenta que también el pie de página quedará transparente. Para que sea blanco usá el siguiente código:
.home footer { background: #fff; }Saludos.
Queria aprovechar lo dinamico de este foro de consultas, para preguntar si tienen como, aprovechando la opcion que brinda WP 4.7 de incorporar template en los posteos, sin necesidad de utilizar plugins que como en mi caso suelen fallar actualizacion tras actualización.
Vi este video https://www.youtube.com/watch?v=A4-axjEGvtY pero no me queda claro como hago ademas para incorporar varios formatos juntos, para poder variar segun los posts.
Hola, Antonio.
Tendrías que usar una plantilla diferente para cada formato que quieras cambiar. La plantilla debería estar encabezada por el siguiente código:
Simplemente usá nombres de plantilla distintos para cada diseño (guardando el archivo también con distinto nombre, por ejemplo,
single-mi-plantilla.php).Saludos.
Hola.
Por favor ayudame con un código para cambiar de color el título principal grande del tema. Gracias
Hola, Hernán.
Fijate en esta respuesta, el código que corresponde al título grande en cabecera.
Saludos.
Muchas gracias.
Ahora si no es mucha molestia porfavor ayudame con esto, ¿Como puedo cambiar el color del pie de página ?. y Gracias por tus aportes.
Hola, Hernán.
La respuesta aquí.
Saludos.
Hola, seria posible hacer más transparentes los campos blancos del formulario contact-form-7 ?.
Gracias nuevamente
Hola, Younly.
Tendrías que darle al fondo un valor menor de opacidad, por ejemplo:
.input-box, .form-control { background: rgba(255,255,255,.75); }Modificá el
.75por el valor que necesites.Saludos.
Saludos, Una consulta:
¿Cómo puedo cambiar el color de sombreado (al colocarle el mouse arriba de la letra)? Tengo un problema con mi web principal www.indweb.com.ve Porque como puedes observar, la convinación de Verde/azúl y el predeterminado sombreado de letras (Naranja) No convina. Si pudieras ayudarme con eso te lo agradecería muchísimo.
Además de lo anterior, ¿Cómo podría cambiarle el color gris que posee la página www.integrasg.com.ve por un negro mate? Es que por las opciones personalizadas no puedo y por el css no tengo ni idea como hacerlo. En fin, gracias por toda la info, excelente página web.
Hola, Víctor.
Para lo primero tendrías que usar el siguiente código:
.sticky-navigation .main-navigation li a:hover, .sticky-navigation .login-register li.login a:hover { color: #000000; }Cambiá
#000000por el valor de color que necesites. Y para lo segundo:.about-us, #footer, .copyright { background: #000000; }Saludos.
en donde colocaría eso? Saludos y buen fia.
Hola, Víctor.
Fijate que está explicado en esta entrada. Puede ser creando un tema hijo, o usando un plugin para agregar código CSS personalizado.
Saludos.
Buenas tardes
Tengo el mismo problema, el color naranja al pasar por encima de las letras no casa con los de mi web, pero al pegar el código
.sticky-navigation .main-navigation li a:hover,
.sticky-navigation .login-register li.login a:hover {
color: #000000;
}
en el CSS Adicional no funciona.
Además de esto, también se ponen naranja y subrayados en naranja los textos del menú y submenús al clicar en ellos. Po último, las líneas debajo de los títulos en las páginas también aparecen naranjas. Podrían ayudarme con eso? Me gustaría cambiarlo todo de color.
Mil gracias por su trabajo.
Hola, María Ángeles.
Ese código corresponde al tema Azera Shop. Para Zerif Lite, los códigos están en esta respuesta.
Saludos.
Hola… como se podría poner un gift en lugar de la imagen de fondo????
Gracias por vuestro gran trabajo. sois de mucha ayuda
Hola, Carlos.
Podés agregar un archivo en formato GIF desde Personalizar > Imagen de fondo.
Saludos.
hola como puedo poner en css una instruccion para que mis paginas salgan semi transparentes o transparentes.. muchas gracias soy principiante
muchas bendiciones por tu labor!
Hola, Erick.
Gracias por tu comentario.
El código es
background: transparent;para un fondo transparente obackground: rgba(0,0,0,.5);para un negro semitransparente (tenés que editar el valor de color rgb y el nivel de alfa). Depende dónde lo quieras aplicar usarás el selector que corresponda. Por ejemplo, una página entera tendría el siguiente código:body { background: transparent; }Saludos.
Hola, cambie ese código en el archivo CSS del documento “style” de la carpeta del tema y no se da cambio alguno, sigue el fondo blanco, ¿qué puedo hacer? Muchas gracias.
Hola, Carlos.
Depende de lo que quieras cambiar. Las páginas internas tienen color de fondo aplicado al contenedor. Si querés cambiar ese fondo, el código sería:
.site-content { background: #000; }Saludos.
Hola me animo nuevamente a solicitar su ayuda, y esta vez les dejo estas tres dudas:
1. Necesito que me faciliten el codigo para poner un color diferente a cada uno de los circulitos que aparecen en la sección Nuestro Enfoque.
2. Cambiarle el color a las secciones de nuestro enfoque y quienes somos.
3. Cree un menu de contacto en la parte inferior de mi pagina y me gustaria que al darle click el mismo se desplace hasta la seccion de contactos que esta en la parte de abajo de la pagina, o de igual manera que se abra en otra pagina, si pudieran por favor me aportan las dos variantes, para valorar cual es la que encaja mejor a mis gustos.
Saludos y mil gracias…ahhh y felicitaciones por tantos aportes que nos dan para que podamos crear nuestras propias web con los minimos conocimientos y con la colaboración de ese eficiente equipo que tienen.
Hola, Younly.
El primer punto ya te lo respondí.
El segundo:
/* Nuestro enfoque */ .focus { background: #000000; } /* Quiénes somos */ .about-us { background: #000000; }El tercero, en el tutorial está explicado cómo añadir los anclajes. Y los elementos del menú que enlazan a páginas internas se agregan como cualquier otro en WordPress, desde Apariencia > Menús.
Saludos.
buenas tardes
quiero cambiar el diseño de texto y fondo de cada pagina.
que debo hacer
gracias.
Hola, Johana.
Este tema está diseñado para presentar la información en una sola página (la portada). Si necesitás algo más avanzado, tendrías que probar con algún plugin constructor de páginas.
Saludos.
Hola,
Quiero felicitarte por tu estupendo sitio y preguntarte: ¿Cómo puedo borrar el background del h1. intro-text, es decir, del título grande de mi sitio?
De antemano,
Mil gracias.
Hola, Andrea.
Gracias por tu comentario. El fondo que se ve en esa sección es el fondo de la página. Si querés ocultar esa imagen con un color sólido, usá la clase
header-content-wrapcon el código que está en esta entrada, pero usando un valor alfa de 1 o un color hexadecimal.Saludos.
Hola,
Mil gracias por responder pero me temo que no lo estoy resolviendo. Cuando desactivo el background en el html funciona, pero cuando copio y pego este setting en el editor CCS, no me lo aplica. 🙁
Otra pregunta: ¿Sabes cómo dejar fija la imagen del padding? saludos y gracias.
Ah, ya logré eliminar la opacidad del fondo. Mil gracias. Saludos.
OK, en cuanto a dejar fija la imagen, no me queda claro a cuál te referís.
Hola, me refiero la que aparece en la sección de título grande, es decir, la del efecto parallax. Me gustaría que no se moviera pero no consigo lograrlo.
Mil gracias nuevamente,
Hola, Andrea.
El efecto Parallax está diseñado justamente para eso: que la imagen y el fondo se muevan, dando una sensación semi-3D. Tendrías que usar la opción de Fondo.
Saludos.
hola buenos dias soy nueva en esto…y tengo una duda..como hago para que la imagen principal de la cabecera quede solo hay y pueda pasar varias imágenes aleatoria mente….y que al desplazar la pagina no se vea como fondo..
Hola, Karina.
Este es el tutorial para reemplazar esa sección por un slider.
Saludos.
Hola, excelentes los aportes, la verdad es que sirven y mucho. Mi consulta es la siguiente: ¿Cómo cambiar el color de la letra del titulo de “Contactenos”?
Hola, Ignacio.
Gracias por tu comentario.
El código sería el siguiente:
#contact .white-text { color: #1990A4; }Saludos.
Hola, estuve leyendo gran parte del blog, gran parte de cada post y no pude conseguir respuesta a una duda, ‘Cómo hacer para desactivar el efecto Parallax’; al desactivarlo con la casilla en el apartado ‘personalizar’ me deja un fondo de color, en este caso gris, ahora bien, quiero tener una imagen en la sección de ‘Titulo Grande’ pero que no tenga ese efecto de ‘brinco’ al que llaman parallax.
Espero sus comentarios.
Gracias.
Hola, Juan.
La sección de título grande usa la misma imagen de fondo del sitio (que se configura en Apariencia > Fondo). Si solo querés aplicar una imagen a esa sección tendrías que usar el siguiente código (en la hoja de estilos del tema hijo o en el recuadro CSS adicional del Personalizador):
.header-content-wrap { background: url(http://rutacompletadelarchivo.com/032.jpg); }Saludos.
Buenos días, me gustaría cambiar el fondo de mi página que por defecto es el blanco al negro, la forma de proceder?
Hola, Vítor.
Este es el código que deberías usar:
.navbar, .focus, .our-team, .latest-news { background: #000; }También tendrías que cambiar el color de los textos para que contraste, por ejemplo:
.navbar-inverse .navbar-nav > li > a, .dark-text, .section-header .section-legend, .focus-box h3, .focus-box p, #carousel-homepage-latestnews .carousel-inner .item .latestnews-title a, .latesnews-content p { color: #fff; }Saludos.
De hecho me gustaría cambiar las “páginas” de fondo, pero ha ayudado mucho. Gracias amigo
Ex.: http://premiotopouro.com.br/o-premio/
En ese caso el código sería:
.site-content { background: #000000; }Saludos.
Gracias amigo, gracias.
Hola que tal, Quería saber si en el código HTML en CSS se puede cambiar directamente la opacidad o tenemos que crear ese archivo hijo de ley?
Hola, Christian.
Solo para hacer cambios de estilo basta con instalar el plugin Simple CSS y pegar el código en el Personalizador, tal como está explicado en esta entrada.
Saludos.
Hola Buenas tardes, me gustaría saber si se puede mover hacia arriba o hacia abajo la sección de titulo grande, mil gracias de antemano
Hola, Younly.
Sí es posible, creando un tema hijo y editando el archivo
front-page.php.El código que tenés que mover es:
$zerif_bigtitle_show = get_theme_mod('zerif_bigtitle_show'); if( isset($zerif_bigtitle_show) && $zerif_bigtitle_show != 1 ): get_template_part( 'sections/big_title' ); endif;Para más información podés revisar esta entrada.
Saludos.
Hola gracias por responder, pero no tengo en mi carpeta del tema hijo ese archivo, que podría hacer en este caso?
Hola, Younly.
Tenés que copiarlo de la carpeta del tema padre a la carpeta del tema hijo.
Saludos.
Cómo se puede agrandar la imagen principal de Zerif?
Hola, Daniel.
Si te referís a la imagen de fondo, existe un tamaño recomendado por ThemeIsle, que es de 2048 x 1365 píxeles. Si querés que se ajuste al ancho de la pantalla, tenés que agregar el siguiente código:
body.custom-background { background-size: cover; }Saludos.
Hola!
¿Como se podría cambiar el color de fondo de las secciones “testimonios” y “¿Quienes somos?”? ¿Se podría hacer con el Advanced CSS editor?
Y otra duda ¿se podrían poner los testimonios en formato carrusel?
Muchas gracias de antemano y enhorabuena por estos tutoriales tan útiles.
Hola, Ibán.
Gracias por comentar.
Los códigos serían:
/* Quiénes somos */ .about-us { background: #000000; } /* Testimonios */ .testimonial { background: #000000; }En cuanto al carrusel, me temo que no es posible sin un nivel muy grande de edición. Podrías buscar un plugin de testimonios con ese estilo y agregar el código abreviado con un
do_shortcode.Saludos.
Muchas gracias!
Funciona perfectamente. ¡y sois muy rápidos!
Respecto a lo del carrusel, con la pista que me habéis dado he visto que el plugin de Carousel CK te permite insertar en la sección Testimonios (o cualquier otra) el carrusel a través de un simple widget. Genial!
¿Como se podría cambiar el color de fondo de las secciones “testimonios” y “¿Quienes somos?”? ¿Se podría hacer con el Advanced CSS editor?
Y otra duda ¿se podrían poner los testimonios en formato carrusel?
disulpen pero donde o en que archivo hago esto
Los códigos serían:
/* Quiénes somos */
.about-us {
background: #000000;
}
/* Testimonios */
.testimonial {
background: #000000;
}
Hola, Miguel.
La última versión de WordPress incluye un panel en el Personalizador denominado CSS adicional, donde podés pegar los códigos (está el ejemplo en esta misma entrada).
Saludos.
Hola Iban!
me podrías por favor compartir lo que encontraste del carrousel, tengo el mismo inconveniente pero no soy tan hábil con la programación, sería genial si lo puedo agregar a la sección de “Simple Custom CSS” como con los cambios de color.
Hola, Sería posible hacer más transparentes los campos blancos del formulario Pirate?
Hola, Mauro.
Este es el código que tendrías que agregar en la hoja de estilos del tema hijo (o en el recuadro CSS adicional del Personalizador):
.pirate_forms input, .pirate_forms textarea { background: rgba(255,255,255, 0.65); }Modificá el valor
0.65por el que necesites. Y como la transparencia también se aplica al texto del campo, agregá lo siguiente:.pirate_forms input::-webkit-input-placeholder, .pirate_forms textarea::-webkit-input-placeholder { color: #000 !important; } .pirate_forms input::-moz-placeholder, .pirate_forms textarea::-moz-placeholder { color: #000 !important; } .pirate_forms input:-ms-input-placeholder, .pirate_forms textarea:-ms-input-placeholder { color: #000 !important; } .pirate_forms input::placeholder, .pirate_forms textarea::placeholder { color: #000 !important; }Podés usar cualquier valor de color en lugar de
#000para que sea distinto del negro.Espero que te sirva.
Saludos.
Perfecto, funciona, muchas gracias.
Hola gracias por todos tus aporte me han servido mucho, queria preguntar como le haces para cambiar el color de la cabezera me aparece blanco en mi tema hijo, pero quiero que se vea de otro color, mas parecido al del tema original, te agradeceria tu respuesta, gracias
Hola, Luis.
Gracias por tu comentario.
En la hoja de estilos del tema hijo tenés que agregar el siguiente código:
.navbar { background: #000000; }Reemplazá
#000000por el valor del color que quieras usar.Espero que te sirva.
Saludos.
Perfecto. Muchas gracias. Seguiré aprendiendo con tu blog 🙂
Hola.
He hecho todos los pasos para quitar la opacidad pero no se me quita.
La duda que tengo es respecto al crear el tema hijo es que al final donde dice:
“Podrá editar el nombre del tema, la descripción, el autor, la versión y las URI de acuerdo con sus necesidades. Solo asegúrese de que Template coincide con el nombre de la carpeta del tema padre.
Por último, cree un archivo en la carpeta /zerif-child/ con el nombre custom.css (que se usará en caso de aplicar estilos personalizados).”
donde dice ASEGÚRESE DE QUE TEMPLATE COINCIDE CON EL NOMBRE DE LA CARPETA DEL TEMA PADRE, no sé muy bien qué significa. No sé si tengo que cambiar algún nombre. Yo copié el código exactamente igual sin modificar nada ¿qué tendría que cambiar?
Hola, Enrique.
Gracias por tu comentario.
El tema padre está instalado dentro de
/wp-content/themes/en el servidor. El nombre de la carpeta se puede comprobar fácilmente desde Apariencia > Temas, haciendo clic enDetalles del temay viendo cuál es la URL que se muestra en la barra de dirección del navegador. Por ejemplo, para Zerif Lite lo más probable es que seahttp://urldelsitio.com/wp-admin/themes.php?theme=zerif-lite.Recordá que luego de crear el tema hijo y subirlo a WordPress hay que activarlo.
Espero que te sirva.
Saludos.
Mil gracias!!!
Buena página, buena atención y muy rápida.
Facil y sencillo. Muchas gracias por mostrar como cambiar esos detalles.
Una pregunta. se puede cambiar el ancho de la imagen de fondo. Se queda corta y quedan huecos blancos en ambos lados.
Muchas gracias.
Hola, Javier.
De nada, me alegro de que haya sido útil. El tema de la imagen de fondo depende básicamente de las dimensiones de la foto. El que se recomienda para este tema es de 2048 x 1365 píxeles. De todas maneras, es posible ajustar una imagen algo más pequeña con el siguiente código:
body.custom-background { background-size: cover; }Pero tené en cuenta que si la imagen es más bien pequeña, en resoluciones altas se va a ver con menor calidad.
Saludos.
La imagen que tengo el grande, por eso no hay problema.
Lo que pasa es que si pongo a 2048 x 1365 se amplia muchísimo. Voy reduciendo pero no pasa nada hasta que hace un cambio brusco al tamaño actual. No hace puntos medios o un tamaño u otro.
Gracias por la ayuda.
Agregá
body.custom-background { background-size: cover; }en la hoja de estilos, con eso se corrige. 😉Funciona perfecto en la versión de escritorio pero no se ajusta en la versión de ipad y móvil. En estas ultimas de ve muy ampliado. ¿Hay alguna solución?.
Muchas gracias la ayuda.
Hola, Javier.
La verdad, no tengo manera de probarlo porque no cuento con dispositivos con iOS; al parecer es un problema común en esos SO (no así en Android, que los muestra correctamente). Fijate si algunas de las respuestas de este foro de CSS Tricks te sirven.
Saludos.