You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
420 lines
10 KiB
CSS
420 lines
10 KiB
CSS
/* Button Css
|
|
|
|
Benutzen mit:
|
|
<div id="button"><div id="button_green_1"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_green_2"><p><a href="">OK 2</a></p></div></div>
|
|
<div id="button"><div id="button_green_3"><p><a href="">OK etwas</a></p></div></div>
|
|
<div id="button"><div id="button_green_4"><p><a href="">OK nochmal</a></p></div></div>
|
|
<div id="button"><div id="button_green_5"><p><a href="">OK noch länger</a></p></div></div>
|
|
|
|
<div id="button"><div id="button_gray_1"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_gray_2"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_gray_3"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_gray_4"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_gray_5"><p><a href="">OK</a></p></div></div>
|
|
|
|
|
|
<div id="button"><div id="button_yellow_1"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_yellow_2"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_yellow_3"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_yellow_4"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_yellow_5"><p><a href="">OK</a></p></div></div>
|
|
|
|
|
|
<div id="button"><div id="button_blue_1"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_blue_2"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_blue_3"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_blue_4"><p><a href="">OK</a></p></div></div>
|
|
<div id="button"><div id="button_blue_5"><p><a href="">OK</a></p></div></div>
|
|
|
|
|
|
*/
|
|
|
|
div#button {
|
|
font-weight: bold;
|
|
}
|
|
|
|
/*
|
|
div#button a {
|
|
text-decoration: none;
|
|
}
|
|
div#button a:hover {
|
|
font-weight: bold;
|
|
}
|
|
*/
|
|
/* Button style green */
|
|
div#button_green_1 {
|
|
}
|
|
div#button_green_2 {
|
|
}
|
|
div#button_green_3 {
|
|
}
|
|
div#button_green_4 {
|
|
}
|
|
div#button_green_5 {
|
|
}
|
|
div#button_green_1 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_green_1.gif);
|
|
}
|
|
div#button_green_2 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_green_2.gif);
|
|
}
|
|
div#button_green_3 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_green_3.gif);
|
|
}
|
|
div#button_green_4 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_green_4.gif);
|
|
}
|
|
div#button_green_5 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_green_5.gif);
|
|
}
|
|
|
|
div#button_green_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_green_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_green_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_green_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_green_2 p {
|
|
width: 50px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_green_2.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_green_3 p {
|
|
width: 75px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_green_3.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_green_4 p {
|
|
width: 100px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_green_4.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_green_5 p {
|
|
width: 125px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_green_5.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
|
|
/* Button style gray */
|
|
div#button_gray_1 {
|
|
}
|
|
div#button_gray_2 {
|
|
}
|
|
div#button_gray_3 {
|
|
}
|
|
div#button_gray_4 {
|
|
}
|
|
div#button_gray_5 {
|
|
}
|
|
div#button_gray_1 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_gray_1.gif);
|
|
}
|
|
div#button_gray_2 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_gray_2.gif);
|
|
}
|
|
div#button_gray_3 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_gray_3.gif);
|
|
}
|
|
div#button_gray_4 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_gray_4.gif);
|
|
}
|
|
div#button_gray_5 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_gray_5.gif);
|
|
}
|
|
|
|
div#button_gray_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_gray_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_gray_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_gray_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_gray_2 p {
|
|
width: 50px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_gray_2.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_gray_3 p {
|
|
width: 75px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_gray_3.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_gray_4 p {
|
|
width: 100px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_gray_4.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_gray_5 p {
|
|
width: 125px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_gray_5.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
|
|
/* Button style yellow */
|
|
div#button_yellow_1 {
|
|
}
|
|
div#button_yellow_2 {
|
|
}
|
|
div#button_yellow_3 {
|
|
}
|
|
div#button_yellow_4 {
|
|
}
|
|
div#button_yellow_5 {
|
|
}
|
|
div#button_yellow_1 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_yellow_1.gif);
|
|
}
|
|
div#button_yellow_2 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_yellow_2.gif);
|
|
}
|
|
div#button_yellow_3 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_yellow_3.gif);
|
|
}
|
|
div#button_yellow_4 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_yellow_4.gif);
|
|
}
|
|
div#button_yellow_5 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_yellow_5.gif);
|
|
}
|
|
|
|
div#button_yellow_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_yellow_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_yellow_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_yellow_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_yellow_2 p {
|
|
width: 50px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_yellow_2.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_yellow_3 p {
|
|
width: 75px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_yellow_3.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_yellow_4 p {
|
|
width: 100px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_yellow_4.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_yellow_5 p {
|
|
width: 125px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_yellow_5.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
|
|
/* Button style blue */
|
|
div#button_blue_1 {
|
|
}
|
|
div#button_blue_2 {
|
|
}
|
|
div#button_blue_3 {
|
|
}
|
|
div#button_blue_4 {
|
|
}
|
|
div#button_blue_5 {
|
|
}
|
|
div#button_blue_1 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_blue_1.gif);
|
|
}
|
|
div#button_blue_2 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_blue_2.gif);
|
|
}
|
|
div#button_blue_3 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_blue_3.gif);
|
|
}
|
|
div#button_blue_4 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_blue_4.gif);
|
|
}
|
|
div#button_blue_5 p:hover {
|
|
background-image: url(../images/buttons_hover/buttons_blue_5.gif);
|
|
}
|
|
|
|
div#button_blue_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_blue_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_blue_1 p {
|
|
width: 25px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_blue_1.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_blue_2 p {
|
|
width: 50px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_blue_2.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_blue_3 p {
|
|
width: 75px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_blue_3.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_blue_4 p {
|
|
width: 100px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_blue_4.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|
|
div#button_blue_5 p {
|
|
width: 125px;
|
|
background-repeat: no-repeat;
|
|
background-image: url(../images/buttons_normal/buttons_blue_5.gif);
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
line-height: 25px;
|
|
padding-left: 0px;
|
|
margin: 0px;
|
|
border-style: none;
|
|
}
|