CSS - Div 填充“除 z 像素外的所有像素”

发布于 2024-12-07 21:27:43 字数 390 浏览 0 评论 0原文

我有一个 div 需要在整个页面上拉伸，但实际内容应该只有 z 像素宽并居中。也就是说，文本不居中，但内容所在的区域（如果您愿意的话，是 div 的内部）居中。

合乎逻辑的方法是做这样的事情：

<div>
<!--I stretch across the entire page!-->
 <div>
 <!--I am z pixels wide, and my margins are auto. Content goes here.-->
 </div>
</div>

这样做的唯一问题是它看起来真的很神圣。这是使用盒模型应该能够实现的。

有没有办法在不添加 div 的情况下做到这一点？

原文

I have a div that needs to stretch the whole way across the page, but the actual content should only be z pixels wide, and centered. That is, the text is not centered, but the area where the content is - the interior of the div, if you will - is centered.

The logical approach is to do something like this:

<div>
<!--I stretch across the entire page!-->
 <div>
 <!--I am z pixels wide, and my margins are auto. Content goes here.-->
 </div>
</div>

The only problem with this is that it seems really div-itis-y. This is something that should be able to be achieved using the box model.

Is there anyway to do this without adding divs?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

别挽留 2024-12-14 21:27:43

body 已经拉伸了页面的宽度，因此只需使用一个内部 div

即可

<body>
    <div></div>
</body>

，

div{
    width:980px;
    margin:0 auto;
}

这就是 div 的用途。

现在，根据内容以及您是否使用 HTML5，您可能希望将其全部包装在另一个元素标记中，例如 header、nav、的。

但是使用 div 并没有本质上的错误，即使是嵌套

body already stretches the width of the page, so just use that one interior div

something like

<body>
    <div></div>
</body>

and

div{
    width:980px;
    margin:0 auto;
}

This is what divs are meant to do.

Now, depending on the content and whether or not you are using HTML5, you may want to wrap it all in another element tag, such as header, nav, section etc.

But there is nothing inherently wrong with using divs, even nested ones.

回复收藏 0 原文

~没有更多了~