SPIP

[ar] [ast] [bg] [br] [ca] [co] [cpf] [cs] [da] [de] [en] [eo] [es] [eu] [fa] [fon] [fr] [gl] [id] [it] [ja] [lb] [nl] [oc] [pl] [pt] [ro] [ru] [sk] [sv] [tr] [uk] [vi] [zh] Espace de traduction

Download
Homepagina > Documentatie in het Nederlands > Webmasters > De grafische weergave aanpassen > Styling van logo’s, afbeeldingen en documenten

Styling van logo’s, afbeeldingen en documenten

11 maart

Alle versies van dit artikel:

Speciale CSS classes die worden toegewezen aan logo’s, afbeeldingen en documenten bieden je de mogelijkheid hun weergave aan te passen.


Style des logos

De logo’s van de verschillende objecten in SPIP (rubrieken, artikelen, nieuwsberichten, auteurs en sites) krijgen systematsich een stijlattribuut .spip_logos, op de HTML tag <img>. Deze class kan handig zijn om bijvoorbeeld de positionering van het logo vast te leggen.

Wil je het logo bijvoorbeeld rechts uitlijnen in het gebied dat wordt aangeduid met «cartouche» met een ruimte tussen de tekst en het logo, dan geef je in je stylesheet aan:

.cartouche .spip_logos {
   float: right;
   margin-left: 1em;
}

Stijlen van afbeeldingen en documenten

Ook het invoegen van documenten en afbeeldingen door middel van de opmaakcodes <docXX|left> en <imgXX|right> wordt met CSS gedefinieerd.

Drie definities kunnen naar persoonlijke wensen worden aangepast, de weergave van documenten, titels en omschrijvingen (legendes):
-  .spip_documents betreft het blok wat het icoon en de documentinformatie bevat (zoals met opmaakcode <docXX|left>) of een afbeelding zonder titel of omschrijving (bijvoorbeeld met <imgXX|right>);
-  .spip_doc_titre controleert de weergave van de titel zelf;
-  .spip_doc_descriptif controleert de omschrijving.

Drie aanvullende stijlen worden gebruikt en zijn onmisbaar voor de positionering van het document of de afbeelding op de pagina:
-  .spip_documents_center voor een gecentreerde weergave (<docXX|center>);
-  .spip_documents_left bij een links uitgelijnd document (<docXX|left>);
-  .spip_documents_right bij een rechts uitgelijnd document (<docXX|right>).

Deze stijlen hebben zowel betrekking op documenten als op afbeeldingen, dus worden zowel toegepast bij (<docXX|uitlijning>) als bij (<imgXX|uitlijning>).

NB: Voor je deze aanpassingen in je stylesheet doet, moet je eerst controleren wat de invloed zal zijn op de andere standaard skeletten die deze definities ook zullen gaan gebruiken, bijvoorbeeld voor de portfolio en de lijst van bijgevoegde documenten (bij artikelen en rubrieken).

Afbeeldingen met of zonder kader

Je kunt een kader rond een afbeelding definiëren. Zo zal: .spip_documents img { border: 1px solid #666; } Je afbeeldingen een smalle grijze omlijsting geven.

Omgekeerd, wanneer je van dat afgrijselijke kader om afbeeldingen met een hyperlink (in sommige browsers) af wilt, forceer je die omlijsting naar een breedte nul: .spip_logos { border: 0; }.


Het skelet van deze bladzijde zien Site gebouwd met SPIP | Vertaalruimte | Privé-site