Ayuda HTML (XML) ...Total Novato

Archivado
Soy un TOTAL NOVATO en programacion, y aun mas novato si me hablais de paginas web.

Pero me he metido a cambiar el aspecto de un blog (de blogger) y estoy teniendo problemas con la imagen de fondo.

La plantilla esta en codigo XML

El caso es que la imagen de fondo va estatica, y el texto del blog se va desplazando sobre esta imagen.

Pero claro, yo he diseñado la imagen con mi Pc, que lo tengo a 1280x1024 . Y la gente que esta viendo el blog a menor resolucion, la imagen de fondo le sale cortada y pierde toda su gracia.

El codigo que controla la imagen de fondo es este.

/* ---( page defaults )--- */
body {  margin: 0px;  padding: 0px;  text-align: left; font:$bodyfont; color:$textcolor; background: #2c1001 url('http://img206.imageshack.us/img206/2150/fondonegrokh1.jpg') no-repeat fixed top left;  }
blockquote {  margin: 0 0 0 30px;  padding: 10px 0 0 20px;  line-height: 1.5em; }
blockquote p {  margin-top: 0;  }
abbr, acronym {  cursor: help;  font-style: normal;  }
code {  color: #f63;  }
hr {  display: none;  }
img {  border: none;  }


¿Se puede hacer que la imagen de fondo se "adapte" a la resolucion de pantalla, o eso requiere otro tipo de codigo mas complejo?

Algun tipo de opcion de "fit" (encajar).

O que dependiendo de la resolucion de pantalla, automaticamente la pagina cargase diferente archivo jpg (Osea, alojar 3 ó 4 archivos jpg de fondo, y que la pagina cargue el necesario en funcion de quien la visite)

No quiero hacer publicidad ni mucho menos, es solo una consulta tecnica, pero si os sirve de apoyo la pagina es http://www.engaliao.com
Eso no es XML, es CSS. Por otra parte, esto no es programación, ni html ni css son lenguajes de programación.

Dejando de lado eso, no se puede encajar ni manejar una imagen de fondo de modo que ocupe toda la pantalla. Puedes hacer que, dependiendo de la resolución, cargue un archivo css u otro, pero es una cutrada y no te lo aconsejo.

Yo uso un ancho de 1650px, mirando la web, veo la imagen y luego un borde rojo. Pon el fondo de la página negro, así donde no llegue la imagen de fondo no notarás diferencia.

background: black url('http://img206.imageshack.us/img206/2150/fondonegrokh1.jpg') no-repeat fixed top left;

Supongo que con eso ya no tendrás problemas para grandes resoluciones, pero para pequeñas no. Poner una imagen estática de fondo nunca me ha gustado, pero en fin, ya que lo haces, los diseños suelen hacerse para un ancho de 760px o 980px más o menos, puesto que hay gente que todavía usa resoluciones de 800x600 (casi nadie ya) o 1024x768. Es decir, no es buena idea hacer un diseño para 1280px de ancho.

La imagen es muy chula, o la dejas así para que se vea bien sólo con resoluciones altas, o la haces más estrecha o miras cómo cargar distinto css dependiendo de la resolución, algo que nunca me ha gustado. Lo hice una vez, hace años, y me dio más problemas de los que me solucionó.

Un saludo
Muchisimas gracias por contestar.

Es obvio que soy novato por la terminologia tan erronea que he utilizado .

Tenia entendido que las plantilas de blogger siempre fueron html+Css pero que con el cambio de diseño las nuevas plantillas son XML.

De hecho yo tenia el blog "antiguo" y ahora he pasado a las "plantillas nuevas" (Xml, segun dice blogger)

Con poner el fondo negro es cierto que se solucionan los problemas a resoluciones altas.

Pero a bajas la imagen se corta. Y claro, he tenido que hacer un "sondeo" entre la gente que suele visitar la pagina y el minimo de alto de resolucion es 768 (el ancho me preocupa menos)

Se que aun hay gente con resoluciones menores, y que seria buena idea hacer el diseño pensando en que lo veo la mayor gente posible...pero bueno, tenia que decidir!!

Lo de cambiar de CSS dependiendo de la resolucion seria una buena alternativa, pero si dices que me puede complicar aun mas....

En resumen: Mil gracias por tu aporte, y si encuentras algun tipo de codigo para el tema de elegir CSS segun resolucion, comentalo.

Un saludo!
Veo que lo has cambiado un poco.

Si lo que te importa es la altura (no había caído en ello), supongo que porque quieres que se vea al señor del banco con el texto, si no te importa que con resoluciones pequeñas no se vea la parte superior del fondo, lo que puedes hacer es fijar el fondo a la parte inferior de la pantalla.

background: black url('http://img206.imageshack.us/img206/2150/fondonegrokh1.jpg') no-repeat fixed bottom left;

Así, si hay suficiente altura se verá la imagen completa; si hay poca altura, se verá al señor sentado y el fondo se cortará por arriba en vez de por debajo.

Si aún así no es suficiente y quieres distintos css según la resolución, en google hay mucha información: http://www.google.es/search?hl=es&q=css+resoluci%C3%B3n&btnG=Buscar+con+Google&meta=
amuchamu escribió: Lo que puedes hacer es fijar el fondo a la parte inferior de la pantalla.

background: black url('http://img206.imageshack.us/img206/2150/fondonegrokh1.jpg') no-repeat fixed bottom left;

Así, si hay suficiente altura se verá la imagen completa; si hay poca altura, se verá al señor sentado y el fondo se cortará por arriba en vez de por debajo.


Exacto, el "problema" es el banco.

Yo tambien habia pensado en anclar la imagen de fondo a la esquina inferior izquierda, pero al final me he decidido por "inventarme" parte de la imagen por debajo, para que la gente con mayor resolucion no vea tanto trozo negro.

Al menos da "el pego" mientras busco algo mas profesional. Voy a gogglear un rato con el tema de los CSS.

Gracias por tus respuestas!!!
4 respuestas
Archivado
Volver a General