html5 css3流畅的布局与灵活的背景图像

时间:2012-10-13 10:59:35

标签: html5 css3 background-image vertical-alignment fluid-layout

我正在使用移动网络应用程序(后来计划将其转换为使用phonegap的原生应用程序),该应用程序使用HTML5 + CSS3 + jQueryMobile 1.2.0。我不擅长css3和html5,而是试图学习和开发移动网站。一切顺利,直到我有一个屏幕,我应该在文本中添加背景图像。我的目标是320 * 480 - 1280 * 798的屏幕。所以,我的网站应该看起来很好而且相同。所以我添加了我的html和CSS的小提琴,并添加了截图。

我的要求:

  • 根据屏幕尺寸(320 - 1280)左右两个图像应该是灵活的
  • 中心的文字应居中对齐(水平+垂直)。
  • 右侧图像上有一个文本也应该居中对齐(水平+垂直)。

我的代码HTML + CSS Code

的小提琴

它导致firefox(1280 * 768)如下(几乎我想要)。

screen shot on firefox and android emulator

但是,当我在Android模拟器(320 * 480)上运行时,它没有正确对齐

所以,请让我知道如何将内容与背景图像/直接图像对齐。最终我的屏幕应该像firefox一样。

提前致谢。

0 个答案:

没有答案