使用 css sprites 作为标题背景的问题
我的网站有一个主 CSS 精灵。现在我对一些文章标题的背景有疑问。我创建了带有圆角的图像。现在我将此背景应用于我的标题,我看不到完整的背景图像,部分图像被裁剪。我想应用 100% 的图像作为背景。
background: #E8E8E8 url(/img/icons/spritelnkd.png) no-repeat 0px -180px;
我很感激任何帮助。
谢谢。
I have a master css sprite for my website. Now I have problems with backgrounds for few article titles. I created image with rounded corners. Now I apply this background for my title, I dont see the complete background image, part of the image gets cropped. I want to apply 100% of the image as background.
background: #E8E8E8 url(/img/icons/spritelnkd.png) no-repeat 0px -180px;
I appreciate any help.
Thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您有两个选择,要么使用 css3 border-radius 选项并删除背景图像,要么需要稍微膨胀您的标记并在标题的一侧引入带有背景图像的第二个容器。本文中针对选项卡描述了此技术:
http://www.alistapart.com/articles/slidingdoors/
You have two options, either you use the css3 border-radius option and drop the background image, or you need to bloat your markup a bit and introduce a second container with a background image for one side of your title. This technique is described for tabs in this article:
http://www.alistapart.com/articles/slidingdoors/
使用占位符映射图像的宽度。
例如:
如果你的图片宽度100px,使用如下
Map the width of your image with it's place holder.
eg:
if your image width 100px, use as follows