Estilos de los logotipos
Los logotipos de los elementos (secciones, artículos, breves, autores, lugares) están dotados sistemáticamente del estilo .spip_logos, situado en la etiqueta HTML <img>. Este estilo puede ser muy útil para, por ejemplo, determinar la posición del logotipo.
De esta forma, para alinear a la derecha los logotipos colocados en el cartucho, por ejemplo, dejando un espacio entre la imagen y el texto, simplemente haremos:
.cartouche .spip_logos {
float: right;
margin-left: 1em;
}Estilos de las imágenes y los documentos
A partir de SPIP 1.8, SPIP 1.8.1, la inserción con los atajos <docXX|left> y <imgXX|right>, de documentos y de imágenes en el cuerpo del texto de un artículo (o de una breve) está controlada por estilos CSS.
Tres definiciones de estilo permiten personalizar la visualización de los documentos, de sus títulos y leyendas:
- .spip_documents afecta a la caja que contiene la miniatura y la información acerca del documento (<docXX|left>) o la imagen insertada sin título ni descripción (<imgXX|right>) ;
- .spip_doc_titre controla la presentación del título del documento ;
- .spip_doc_descriptif controla la presentación de la descripción del documento.
Tres estilos son utilizados como complemento, indispensables para definir la posición del documento o de la imagen en la página:
- .spip_documents_center cuando el documento está alineado al centro (<docXX|center>) ;
- .spip_documents_left cuando el documento está alineado a la izquierda (<docXX|left>) ;
- .spip_documents_right cuando el documento está alineado a la derecha (<docXX|right>).
Fíjate bien que estos estilos afectan de la misma forma a las imágenes (<imgXX>) y a los documentos (<docXX>).
NB: Antes de modificar radicalmente estas definiciones de estilo, fíjate que estas reglas son usadas igualmente con las plantillas por defecto (a partir de SPIP 1.9) para dar estilo a los elementos del portafolio y a las listas de documentos adjuntos (en los artículos o secciones).
Imágenes con o sin contorno
A partir de SPIP 1.9 es posible aplicar un contorno a las imágenes. Por ejemplo: .spip_documents img { border: 1px solid grey; } enmarcará tus imágenes con un fino contorno gris.
Inversamente, para no ver tus logotipos enmarcados con ese horrible contorno azul que señala tradicionalmente las «imágenes clicables» en algunos navegadores (como Firefox), no olvides poner su contorno a cero: .spip_logos { border: 0; }.