CSS stránkovač/pokr.
Stánkovač s gradientem a aktivním tlačítkem (stránkou). Stránkovač lze dále upavovat.
<style>
a.tlacitko {
position: relative;
display: inline-block;
width: 28px;
height: 28px;
line-height: 30px;
vertical-align: middle;
text-align: center;
text-decoration: none;
color: #000099;
background: #E6F3FF;
font-family: arial, sans-serif;
outline: none;
border-radius: 5px;
box-shadow: 0 0 0 1px #0066ff inset, 0 1px 1px #fff;
}
a.tlacitko:hover {
color: #000099;
background: linear-gradient(to top, #66ccff 0%, #ccffff 100%);
box-shadow: 0 0 0 1px #0066ff inset, 0 1px 2px #3399ff;
}
a.tlacitko-aktivni {
display: inline-block;
width: 28px;
height: 28px;
line-height: 30px;
vertical-align: middle;
text-align: center;
text-decoration: none;
color: #000099;
font-family: arial, sans-serif;
outline: none;
border-radius: 5px;
background: linear-gradient(to top, #66ccff 0%, #ccffff 100%);
box-shadow: 0 0 0 1px #0066ff inset, 0 1px 2px #3399ff;
}
</style>
<a href="#no" class="tlacitko">1</a>
<a href="#no" class="tlacitko">2</a>
<a href="#no" class="tlacitko-aktivni">3</a>
<a href="#no" class="tlacitko">3</a>
<a href="#no" class="tlacitko">5</a>
<a href="#no" class="tlacitko">6</a>
<a href="#no" class="tlacitko">7</a>