0

相対位置を指定して、いくつかの div レイヤーの上に大きな画像を配置しています。私も使用しています top: -170px; 画像を必要な場所に正確に引き上げます。Firefox では完全に機能しますが、IE では、その下の青いバーの位置を調整して、上部の負の位置を考慮しません。

意味がわからない場合は、ライブ開発サイトをご覧ください。

http://www.suncastmedia.com/clients/ezbook/

firefox と IE の両方を見れば、私の言いたいことがわかるでしょう。これらの特定の div の CSS もここにあります。

#red-box {
  width: 100%;
  height: 343px;
  background: url('../images/bg-red.png') top left repeat-x;
  text-align: left;
}

#red-box-text {
  position: relative;
  left: 70px;
  top: 45px;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
  font-family: helvetica;
  width: 451px;
}

#spacer {
  width: 100%;
  height: 8px;
}

#blue-box {
  width: 100%;
  height: 29px;
  background: url('../images/bg-blue.png') top left repeat-x;
}

#pic-globe {
  position: relative;
  top: -170px;
  left: 52%;
  background: url('../images/pic-globe.png') top left no-repeat;
  width: 506px;
  height: 471px;
}
4

1 に答える 1

1

切り替え#pic-globeて#red-box-textから に追加できfloat: right;ます#pic-globe。一般に、大きな負のマージンを使用している場合は、もっと簡単な方法があるかもしれません。

于 2012-09-06T04:06:18.043 に答える