全身压倒背景
因此，已经有人对此提出了一些问题，但我的问题更具体一些。
当用户以管理员身份登录时，我想在 CMS 所有页面的顶部添加一个 40 像素高的管理栏。
但又不想遮盖页面内容，所以想把它往下推。请记住，这是一个 CMS，因此使用它的所有页面上都有很多不同的 CSS/设计。不过系统确实可以控制所有 CSS，所以我可以即时更改它。
我首先向 body 元素添加“margin-top: 40px”，然后意识到 BODY 的背景图像实际上并未附加到 body，而是附加到其他无法设计样式的根元素。
因此，我使用“background-position: 0 40px”来向下移动背景图像。分数！只是，一些网站已经使用背景位置来定位与内容相关的背景，而我覆盖了这严重混乱了这些页面的设计。
那么 - 有更好的方法来处理这个问题吗？或者我是否必须动态解析和更改每个网站可能的背景位置 - 我可以做，但不是:)
感谢您的帮助！
So, there have been some questions about this already, but mine is a bit more specific.
I want to add a 40px high admin bar to the top of all pages of my CMS when the user is logged in as an admin.
But I don't want to obscure the content on the page, so I want to push it down. Remember, this is a CMS so there is a lot of different CSS/designs on all the pages that use it. The system do have control of all the CSS though, so I can change it on the fly.
I started out by adding a "margin-top: 40px" to the body element before realizing that the background-image of BODY isn't actually attached to the body, but rather the otherwise unstylable root element.
So, I used "background-position: 0 40px" to move down the background image. Score! Only, some sites already used background-position to position their background in relation to the content and me overriding that severely messed up the design of those pages.
So - is there a better way to handle this? Or am I going to have to parse and alter every sites possible background-position on the fly - which I can do, but rather not :)
Thanks for your help!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
为了避免该问题，您可以更改 CMS 的运行方式。添加一个完整的页面包装
div，充当用户内容的主体。然后，在包装器上方插入一个 40 像素高的元素将普遍将其向下推。To avoid the problem, you could change the way your CMS functions. Add a full page wrapper
divthat acts as a body for the user's content. Then, inserting a 40px high element above the wrapper will universally push it down.您可以尝试以下操作，但您可能需要将 cms 工具栏放置在负方向。
You can try the following, you might need to position your cms toolbar negatively though.
如果背景应用于 html 元素，您可以下推 html 元素，然后使用
position:absolute定位标题。示例： http://jsfiddle.net/u22zE/2/You can push down the html element if the background is applied to the html element, and then use
position:absoluteto positioning your header. Example: http://jsfiddle.net/u22zE/2/