git-svn-id: https://192.168.0.254/svn/Proyectos.PosadaLaLlosa_Web/trunk@11 4b469eb7-237d-4988-9973-fa40bd9eeb91
150 lines
3.7 KiB
CSS
150 lines
3.7 KiB
CSS
/*
|
|
CSS de Posada la Llosa
|
|
|
|
*/
|
|
|
|
/* Propiedades de los enlaces */
|
|
a {
|
|
margin : 0 auto; /* No queremos márgenes */
|
|
display: block; /* Permite que se indique el tamaño de el enlace */
|
|
}
|
|
|
|
/* Propiedades de las imagenes */
|
|
img {
|
|
border: 0px; /* sin borde */
|
|
}
|
|
|
|
/* Div de contenidos */
|
|
#contenido {
|
|
position : absolute; /* Posición absoluta en la página */
|
|
left : 50%; /* La parte izquierda a la mitad de la pantalla */
|
|
margin-left : -390px; /* Ahora quitamos el margen (esto y lo de arriba hace que se centre independientemente del tamaño de la pantalla) */
|
|
margin-top : 30px; /* Margen superior */
|
|
}
|
|
|
|
/* Div del menu */
|
|
#menu{
|
|
width: 790px; /* Ancho */
|
|
}
|
|
|
|
/* Div del cuerpo (donde estan las fotos) */
|
|
#cuerpo {
|
|
width : 790px; /* Ancho */
|
|
}
|
|
|
|
/* Div del pie */
|
|
#pie {
|
|
width : 790px; /* Ancho */
|
|
height: 30px; /* Alto */
|
|
}
|
|
|
|
/* Menu Inicio */
|
|
#principio {
|
|
background: url(../imagenes/menu/inicio.gif) no-repeat; /* Asigno la imagen */
|
|
float : left; /* Que se ajuste a la izquierda */
|
|
width : 65px; /* Ancho */
|
|
height : 30px; /* Alto */
|
|
}
|
|
a#principio:hover, /* Que tiene que hacer el enlace cuando se pase el ratón por encima */
|
|
body.pgprincipio #principio a { /* Que tiene que hacer el enlace cuando el body tiene este class */
|
|
background-position: 0 -40px; /* Le restamos margen superior (esto hace que la imagen suba) */
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu La Posada */
|
|
#posada {
|
|
background: url(../imagenes/menu/laposada.gif) no-repeat;
|
|
float : left;
|
|
width : 90px;
|
|
height : 30px;
|
|
}
|
|
a#posada:hover,
|
|
body.pgposada #posada a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu Habitaciones */
|
|
#habitaciones {
|
|
background: url(../imagenes/menu/habitaciones.gif) no-repeat;
|
|
float : left;
|
|
width : 102px;
|
|
height : 30px;
|
|
}
|
|
a#habitaciones:hover,
|
|
body.pghabitaciones #habitaciones a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu Apartamentos */
|
|
#apartamentos {
|
|
background: url(../imagenes/menu/apartamentos.gif) no-repeat;
|
|
float : left;
|
|
width : 114px;
|
|
height : 30px;
|
|
}
|
|
a#apartamentos:hover,
|
|
body.pgapartamentos #apartamentos a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu Entorno */
|
|
#entorno {
|
|
background: url(../imagenes/menu/entorno.gif) no-repeat;
|
|
float : left;
|
|
width : 68px;
|
|
height : 30px;
|
|
}
|
|
a#entorno:hover,
|
|
body.pgentorno #entorno a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu Actividades */
|
|
#actividades {
|
|
background: url(../imagenes/menu/actividades.gif) no-repeat;
|
|
float : left;
|
|
width : 94px;
|
|
height : 30px;
|
|
}
|
|
a#actividades:hover,
|
|
body.pgactividades #actividades a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
|
|
/* Idem que menu Inicio para menu Como llegar */
|
|
#llegar {
|
|
background: url(../imagenes/menu/comollegar.gif) no-repeat;
|
|
float : left;
|
|
width : 99px;
|
|
height : 30px;
|
|
}
|
|
a#llegar:hover,
|
|
body.pgllegar #llegar a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu Precios */
|
|
#precios {
|
|
background: url(../imagenes/menu/precios.gif) no-repeat;
|
|
float : left;
|
|
width : 69px;
|
|
height : 30px;
|
|
}
|
|
a#precios:hover,
|
|
body.pgprecios #precios a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|
|
/* Idem que menu Inicio para menu Reservas */
|
|
#reservas {
|
|
background: url(../imagenes/menu/reservas.gif) no-repeat;
|
|
float : left;
|
|
width : 80px;
|
|
height : 30px;
|
|
}
|
|
a#reservas:hover,
|
|
body.pgreservas #reservas a {
|
|
background-position: 0 -40px;
|
|
}
|
|
|