Stile dei logo
I logo degli elementi (rubriche, articoli, brevi, autori, siti) hanno sistematicamente lo stile .spip_logos, posto nel tag HTML <img>. Tale stile può essere utile, ad esempio, per determinare la posizione del logo.
Quindi, per allineare a destra i logo messi nel box, per esempio, pur lasciando uno spazio tra l’immagine e il testo, si scriverà semplicemente:
.cartouche .spip_logos {
float: right;
margin-left: 1em;
}Stili delle immagini e dei documenti
Dalla versione SPIP 1.8, SPIP 1.8.1, l’inserimento tramite scorciatoia <docXX|left> e <imgXX|right>, di documenti e immagini nel corpo del testo di un articolo (o di una breve) viene controllato dagli stili CSS.
Tre definizioni di stili permettono di personalizzare la visualizzazione dei documenti, dei loro titoli e delle loro descrizioni:
- .spip_documents riguarda il riquadro che contiene l’icona e le informazioni del documento (<docXX|left>) o l’immagine inserita senza titolo né descrizione (<imgXX|right>);
- .spip_doc_titre controlla la visualizzazione del titolo del documento;
- .spip_doc_descriptif controlla la visualizzazione della descrizione del documento.
Tre stili sono utilizzati a complemento, e sono indispensabili per poter definire il posizionamento del documento o dell’immagine nella pagina:
- .spip_documents_center quando il documento è centrato (<docXX|center>);
- .spip_documents_left quando il documento è allineato a sinistra (<docXX|left>);
- .spip_documents_right quando il documento è allineato a destra (<docXX|right>).
Si noti che questi stili riguardano alla stessa maniera le immagini (<imgXX>) e i documenti (<docXX>).
N.B.: Prima di modificare in maniera radicale queste definizioni di stile si noti che esse sono utilizzate anche nei modelli di default (dalla versione SPIP 1.9), per dare stile agli elementi del portafoglio e degli elenchi dei documenti allegati (agli articoli e/o alle rubriche).
Immagini con o senza bordo
Dalla versione SPIP 1.9 è possibile applicare un bordo alle immagini. Per esempio: .spip_documents img { border: 1px solid grey; } metterà in cornice le immagini con un bordo grigio sottile.
Viceversa, per non mostrare intorno ai propri logo alcuna orribile cornice blu che segnala le «immagini cliccabili» su alcuni browser (per es., FireFox), non dimenticate di mettere il bordo a zero: .spip_logos { border: 0; }.