What does a refreshing button button look like?
A refreshing button button style, many novices are not very clear about this, in order to help you solve this problem, the following editor will explain in detail for you, people with this need can come to learn, I hope you can gain something.
The effect is as follows:
The code is as follows:
.clear {/ * generic container (i.e. Div) for floating buttons * /
Overflow: hidden
Width: 100%
}
A.button {
Background: transparent url ('IMG/bg_button_a.gif') no-repeat scroll top right
Color: # 444
Display: block
Float: left
Font: normal 12px arial, sans-serif
Height: 24px
Margin-right: 6px
Padding-right: 18px; / * sliding doors padding * /
Text-decoration: none
}
A.button span
{
Background: transparent url ('IMG/bg_button_span.gif') no-repeat
Display: block
Line-height: 14px
Padding: 5px 0 5px 18px
}
A.button:active {
Background-position: bottom right
Color: # 000
Outline: none; / * hide dotted outline in Firefox * /
}
A.button:active span {
Background-position: bottom left
Padding: 6px 0 4px 18px; / * push text down 1px * /
}
Button
Here are two pictures under the IMG folder:
Bg_button_a:
Bg_button_span:
Is it helpful for you to read the above content? If you want to know more about the relevant knowledge or read more related articles, please follow the industry information channel, thank you for your support.
