 Joomla kruimelpad / breadcrumbs css stijlen
Er is een kruimelpad module aangemaakt in de toppositie van de website. De suffix voor het kruimelpad is _kruimelpad. Zonder verdere stijling ziet een pagina nu er als volgt uit.
De tekst van het kruimelpad is nu niet zo goed te zien, omdat de letters donker zijn tegen een donkere achtergrond. De structuur van het kruimelpad ziet er als volgt uit.
div.moduletable_kruimelpad
span.breadcrumbs.pathway a.pathway img (arrow.png)
Stijlen
Voor de voorbeeld website zijn de volgende stijlen toegepast.
div.moduletable_kruimelpad {
margin-bottom: 10px;
color: #ffffff;
padding: 8px 0 0 6px;
}
div.moduletable_kruimelpad span.breadcrumbs {}
div.moduletable_kruimelpad span.pathway {
font-size: 10px;
}
div.moduletable_kruimelpad span.pathway a.pathway,
div.moduletable_kruimelpad span.pathway a:visited.pathway {
color: #ffffff;
}
div.moduletable_kruimelpad span.pathway a:hover.pathway {
color: #cccccc;
}
Het kruimelpad maakt standaard gebruik van een png image (arrow) die oranje is gekleurd. Dit past niet zo goed in dit ontwerp en dus is in de module kruimelpad gekozen voor een scheidingsteken ►. Na stijling ziet het kruimelpad er als volgt uit.
|