-1

このロゴの左側にもう1つの画像を追加するヘッダーロゴがあります。私はmargin-leftプロパティを使用しており、IE6を除くすべての主要なブラウザーで完全に機能します。ちょっとした調査として、position:relativeプロパティを使用してこの負の値を修正しました。しかし、運はありません。これが私が使用したコードです。

<body>私がこれを使用しているセクションで

<div id="logo">
<span style="position:relative;margin-left:-400px"><img src="image path"/>
</span>
</div>

現在、DIV id="logo"には次のcssスタイルがあります

#logo {
    background: url("../images/logo.jpg") repeat scroll 0 0 transparent;
    border: 0 solid black;
    float: right;
    height: 70px;
    margin-top: 10px;
    padding: 0;
    width: 387px;
}
4

4 に答える 4

2

次のコードは、私の IETester - IE6 モードでうまく動作します。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <style type='text/css'>
#logo {
    background: url("logo.png") repeat scroll 0 0 #EEE;
    border: 0 solid black;
    float: right;
    height: 70px;
    margin-top: 10px;
    padding: 0;
    width: 387px;
}
#logo span {
    position:relative;
    left:-400px;
    background:blue;
}
</style>
</head>
<body>
  <div id="logo">
<span><img src="logo.png" alt="" />
</span>
</div>
</body>
</html>

PS たぶん、次のようなものを使用する必要があります。

<div id="logo-wrapper">
    <div id="logo" style="float:right;"></div>
    <div style="float:right;"><img src="logo.png" /></div>
</div>
于 2012-05-17T06:46:26.993 に答える
1

はい、IE6 は負の margin-padding 値をサポートしていないため、左右の位置を負または正にして配置を操作して、目的の結果を得ることができます......

このような：-

HTML

<div id="logo">
<span>span</span>
</div>

CSS

    #logo {
    background: red;
    border: 0 solid black;
    float: right;
    height: 70px;
    margin-top: 10px;
    padding: 0;
    width: 387px;
}

#logo span {
position:relative;
left:-200px;
background:yellow;
    width:50px;
    height:50px;
}
于 2012-05-17T07:09:13.993 に答える
1

要素にフローティングがある場合、この場合、IE6 はマージン値を 2 倍にします。したがって、400px を左に移動する場合は、IE6 用に個別に書き込む必要があります。margin-left: -200px

#logo{position:relative}
span {position:absolute:left:-400px}
于 2012-05-17T05:50:21.723 に答える
0

または属性を使用position:relativeして、適切な場所に配置することができます。または、IE ブラウザ用の特定のスタイルを記述します。leftright

 .header{
     position:relative;
     left: -200px;
   }
于 2012-05-17T05:56:06.827 に答える