css - 扩展边界

Question

我有一个图像将在窗口中居中（左右），没有左边框，但有一个右边框。我想知道上边框是否有可能从页面的最左侧（经过图像）开始并停在右边框，而下边框是否可以从图像的左端开始并延伸到所有窗口右侧的方式。顶部和底部边框由两个不同的重复背景组成，如果需要，左边框也可以是。

我一直在考虑这个问题，但无法提出任何解决方案......有人可以帮助我吗？

Answer 1

您可能想澄清您愿意变得多么灵活。您可以通过多种方式进行处理。您是否希望顶部和底部边框延伸到视口的边缘（因此需要它们是流体宽度）？

background-position您可以使用带有滑动门技术的背景图像来处理此问题，或者您可以使用无关标记创建一个三列流体宽度布局，其中您的图像位于中心。

这取决于您，但使用三列技术，您可以divs通过 JavaScript 插入额外的（或您想使用的任何内容），这样您的源中就不会有空容器，并使用border-topandborder-bottom而不是背景图像（因此减少页面的一些加载时间）。

编辑：为了澄清，你希望它看起来像这样的 Ascii 绘图：

_______________
               |img|_____________________

编辑：对于流体宽度布局，请参阅 CSS 布局的众多资源之一，这是一个很好的概要： http ://www.smashingmagazine.com/2007/01/12/free-css-layouts-and-templates/

然后在你的左列和右列上，你会分别做border-top和border-bottom（或者如果你想要更漂亮的边框，可以使用背景图像），给你的图像边框，并设置你的三个容器的高度，使边框排列在一起。希望有帮助。