如何制作背景图像以调整其大小以适应包含元素？
Check the rounded corners of the main tabs in this site Those are background images with width of 440px, and still it adjusts to the containing element without loosing the rounded edges.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
看起来列表项和锚点都有相同的背景图像，只是偏移量不同。
该图像被设置为每个元素的背景。锚点设置为显示图像的最左侧部分，而列表项设置为最右侧部分，右侧填充的宽度刚好足以让图像浏览。该技术被称为“滑动门”。以下是从 其他 答案：
谢谢 Mariuz 和 Darko Z。
Looks like the list item and anchor both have the same background image, just at different offsets.
The image is set as the background for each of those elements. The anchor is set to show the left most portion of the image while the list item is set the right most portion with right padding just wide enough for the image to peek through. The technique is known as Sliding Doors. Here are the links collected from the other answers:
Thanks Mariuz and Darko Z.
他们正在使用一种称为“滑动门”的技术。您可以在 A List Apart 阅读更多相关信息：
滑动门第 1 部分
滑动门第 2 部分
they are using a technique known as "Sliding doors". You can read more about it at A List Apart:
Sliding Doors Part 1
Sliding Doors Part 2
网上有一些关于圆角的教程。
使用 CSS2 您可以尝试以下操作：
CSS2 教程
如果您想使用 CSS3：
CSS3 教程
简单的 google 搜索圆角将为您提供许多有用的教程。
There are several tutorials on rounded corners on the net.
Using CSS2 you can try the following:
CSS2 Tutorial
If you want to use CSS3:
CSS3 Tutorial
A simple google search for rounded corners will give you many helpful tutorials.
它可能只是外围相关，但我们应该小心，不要让浏览器将大图像调整为更实用的尺寸。
如果浏览器只会将大图像缩小，为什么还要用大图像填充页面呢？
It may be only peripherally relevant, but we should be careful not to leave it to the browser to resize large images to a more practical size.
Why fill a page with large images if they're only going to be scaled down by the browser?