在 HTML(使用 CSS)中,我使用以下代码创建具有背景图像(或者更确切地说:链接左侧的图像)的链接列表:
HTML:
<ul>
<li><a class="share_fb" href="#">Like on Facebook</a></li>
<li><a class="share_tw" href="#">Share on Twitter</a></li>
<li><a class="share_gp" href="#">+1 on Google Plus</a></li>
</ul>
CSS:
a {
font-size: 1.4em;
}
a.share_fb {
background: transparent url(images/share_fb.png) scroll no-repeat left center;
padding: 0.1em 0 0.1em 0.4em;
}
...
问题是:我尽力使整个页面可缩放。但是当涉及到背景图形时:应该如何做呢?哪种尺寸最适合这些背景图片?它们可能不会大于文本行,但应随文本缩放。
最佳答案
尝试添加:
background-size: contain;
到您的a.share_fb
类(class)。这应该使背景图像缩放到元素的整个高度(不是文本的宽度)。
关于html - HTML 中链接的可缩放背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10192306/