Voorbeeld CSS: verschil tussen versies
Naar navigatie springen
Naar zoeken springen
Geen bewerkingssamenvatting |
Geen bewerkingssamenvatting |
||
Regel 15: | Regel 15: | ||
.middle_button2 {font-size:1.2em;} | .middle_button2 {font-size:1.2em;} | ||
.middle_button_link a, .middle_button_link a:link, .middle_button_link a:visited, .middle_button_link a:active{font-size: 1.15em;}</code> | .middle_button_link a, .middle_button_link a:link, .middle_button_link a:visited, .middle_button_link a:active{font-size: 1.15em;}</code> | ||
== Winkelwagen == | |||
<code>/*1 verbergen huidige winkelwagen*/ | |||
.winkel_wagen{display:none;} | |||
/* 2 nieuwe winkelwagen positioneren vormgeven*/ | |||
#custom_winkelwagen{position:absolute;top:19px;right:0px;width:115px;height:30px;padding-left:5px;display:block;border-left:solid 1px #000;text-transform:uppercase;} | |||
#custom_winkelwagen a{color:000;} | |||
/*3 inlog gedeelte verplaatsten naast nieuwe winkelwagen*/ | |||
#inlog{float:right;text-align:right;margin-top:0px;position:absolute;top:16px;right:125px;} | |||
#inloggen a{color:#000;}</code> |
Versie van 18 feb 2013 15:55
Hieronder een paar voorbeeld CSS eigenschappen.
Buttons
Met onderstaande code kun je ervoor zorgen dat de buttons in Xpression Manager geen pijltjes meer aan de linker kant, en geen afgeronde hoeken aan de rechterkant meer hebben.
Het worden dan rechthoekige buttons, zie afbeelding hieronder.
Voeg onderstaande CSS toe aan "extra CSS"
/*buttons*/
/*linker- en rechterdeel van de button verbergen*/
.left_button, .right_button{display:none;}
/*zorgen dat de buttons meer ruimte krijgen naast de tekst, en tekst even groot*/
.middle_button2, .button{padding-right:10px;background-color:#00afca;padding-left:10px;}
.middle_button2 {font-size:1.2em;}
.middle_button_link a, .middle_button_link a:link, .middle_button_link a:visited, .middle_button_link a:active{font-size: 1.15em;}
Winkelwagen
/*1 verbergen huidige winkelwagen*/
.winkel_wagen{display:none;}
/* 2 nieuwe winkelwagen positioneren vormgeven*/
#custom_winkelwagen{position:absolute;top:19px;right:0px;width:115px;height:30px;padding-left:5px;display:block;border-left:solid 1px #000;text-transform:uppercase;}
#custom_winkelwagen a{color:000;}
/*3 inlog gedeelte verplaatsten naast nieuwe winkelwagen*/
#inlog{float:right;text-align:right;margin-top:0px;position:absolute;top:16px;right:125px;}
#inloggen a{color:#000;}