我在让我的标题图像正确流动时遇到了一些问题。这是一个响应式 WP 主题。
这是我想要实现的设计。（我现在不担心社交图标）： http ://screencast.com/t/0xJuqKuteU
首先，我需要带有红色背景的消息栏在徽标下方和横幅之外流动，如下所示：http ://screencast.com/t/CZ4DkbRA50R
然后对于横幅和消息栏，当屏幕缩小到手机大小时，我需要它们更好地工作。这就是我需要它在手机上看的方式：http: //screencast.com/t/z5BQ7zB4
请注意，横幅出现在导航的正下方，消息栏消失了。
这是我正在开发的网站：http: //dev.frugalreality.com
谢谢你的帮助！！
To make the message bar "float" underneath the logo, you need to set the containing div css (#header-callout) to have position:relative; and set the z-index to something negative (z-index: -1 should do). This creates a layering in the divs and puts the message bar below all other divs (unless you set something else to a lower z-index).
For displaying things differently on the iPhone screen size I would suggest using a media-query. If you don't know how to use those, I suggest browsing through this article to get a better idea of what I mean: http://css-tricks.com/css-media-queries/
In order to NOT display the message bar, you will have to put display:none for the #header-callout in the css of the appropriate media-query.
拥有一个屏幕 CSS 和媒体/电话 CSS 页面应该有助于管理这两个不同的屏幕。