HTML and CSS Reference
In-Depth Information
The border of the button is easily created with a
border:1px solid #90c8d4;
property and the rest of the
font styling is very simple, as well (
font, text-decoration,
color etc.
).
Remember that both states of “
btn
' are in the same
btn.png
file?
First part is the
default
state and the secondary part
is for the
:hover
state to show whenever you move the
cursor on it.
While you could have moved them in two separate
files, two issues would have arrised:
• you need to download two separate images, thus
adding an other resource to download;
• a flash of white background would appear when
:hover
is activated because only when you activate
the
:hover
state, you actually download that image.