<style type="text/css"> /*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */ .shadetabs{ border-bottom: 1px solid gray; /* width: 90%; width of menu. Uncomment to change to a specific width */ margin-bottom: 1em; } .shadetabs ul{ padding: 3px 0; margin-left: 0; margin-top: 1px; margin-bottom: 0; font: bold 12px Verdana; list-style-type: none; text-align: left; /*set to left, center, or right to align the menu as desired*/ } .shadetabs li{ display: inline; margin: 0; } .shadetabs li a{ text-decoration: none; padding: 3px 7px; margin-right: 3px; border: 1px solid #778; color: #2d2b2b; background: white url(media/shade.gif) top left repeat-x; } .shadetabs li a:visited{ color: #2d2b2b; } .shadetabs li a:hover{ text-decoration: underline; color: #2d2b2b; } .shadetabs li.selected{ position: relative; top: 1px; } .shadetabs li.selected a{ /*selected main tab style */ background-image: url(media/shadeactive.gif); border-bottom-color: white; } .shadetabs li.selected a:hover{ /*selected main tab style */ text-decoration: none; } </style>
oraz w pliku html daje:
jest to prosty spsoob na wyświetlenie zakładek, ale jak zrobić aby po kliknięciu np. w Forums zakladka automatycznie zmieniła wartość na "class="selected"" ?