CSSを単独で使用して、表のセルからブラウザウィンドウの左上に画像を移動します。

ウェブサイトの外観を変更していますが、CSSを変更することはできません。私はテーブル内のセル内にある画像をページに約100/100pxずつ戻して、0/0pxに戻したいと考えています。CSSを単独で使用して、表のセルからブラウザウィンドウの左上に画像を移動します。

タグには固有のIDがありますが、テーブルのIDは一意ではなく、CSSのテーブルの背景イメージを設定するとサイトの他の部分に影響します。私は体の背景イメージを設定しようとしましたが、このページは各フレームが同じスタイルシートを参照するフレームセットです。その結果、各フレームに背景画像が得られます。

HTMLのA大幅に簡略化バージョンとそうである：絶対位置を使用するように前記皆に

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <title>move image</title> 
     <style type="text/css"> 
      #imgLogo {/*how can I move this to 0,0?*/} 
     </style> 
    </head> 
    <body> 
     <table style="margin-left:100px; margin-top:100px;"> 
      <tr> 
       <td> 
        <img id="imgLogo" src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="google" /> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

EDIT

おかげ。これは確かにhtmlの例を修正しましたが、実際の問題は修正しませんでした。その理由は、親要素の1つにすでに位置が絶対的に設定されていますが、座標はありませんでした。この要素を左と上の位置に設定すると、そのトリックが実行されました。

出典

2009-05-13 Chris Simpson

テーブルの位置にCCSを設定：位置からの相対とあなたの画像：絶対にトップを与える：0PXを左：0PXを。

出典

2009-05-13 21:00:07

私は上記（4秒で殴ら - あなたは実際に数字を得た）これは、特定のhtmlではなく、実際のhtmlで動作します。これは、何か他のものがこのイメージの動きを止めていることを私に伝えます。ありがとう。 –

他のCSSファイルがページ上で参照されていますか？ –

いいえ、間違いなく。私はこれを確認して二重チェックしました。私はちょうど問題をもう一度見て、画像が入っているテーブルが別のテーブルの中に入れ子になっています。私はそれが私の例に違いをもたらすかどうかを見極めるつもりです。もしそうなら、新しいサンプルhtmlを表示するように質問を変更します。 –

使用CSSのポジショニング：

#imgLogo { 
position:absolute; 
top:100px; 
left:100px; 
}

出典

2009-05-13 21:00:04

[OK]を、これは奇妙です。これは、私が与えた例では完璧に仕事をしているようですが、これが私が試した最初のことであり、実際の例ではうまくいきません。あなたは確かに質問に答えるためのポイントを持つことができますが、私はそれが悪い質問だったと恐れています。 –

絶対位置が重要です：

#imgLogo { 
    position: absolute; 
    top: 0; // This is the default value, but whatever 
    left: 0; //^
}

出典

2009-05-13 21:02:32

CSSを単独で使用して、表のセルからブラウザウィンドウの左上に画像を移動します。

答えて

関連する問題