How to put a background image to a link. Size coming out incorrectly even when i specify it
This is driving me nuts. I am trying to set a background image to a link which I have given the class attribute replace. When I use the code I have written below it only shows the background picture for the length of the text 'Logo link' 开发者_如何转开发and it has not height to it, even though I specify the width and height to be 334 by 67 pixels in the style tage below. What am I doing wrong?
<style type="text/css">
#head #logo a { background: url('www.example.com') !important; width: 334px !important;}
#logo .replace
{
width: 334px;
height: 67px;
}
</style>
<body>
<div id="head">
<p id="logo"><a href="/" class="replace">Logo link</a></p>
</div>
</body>
Because, by default, the a element is inline, and cannot have height. Try adding the rule display:block to the #head #logo a section.
Anchor is an inline element -- it won't take a height until you explicitly set it to display: block.
Just add
a
{
display: inline-block;
}
加载中,请稍侯......
精彩评论