0

メインdivに背景画像として実装されているWebサイトのスプラッシュページがあります。

#main
{
    background:url('../img/splash.jpg');
    background-repeat:no-repeat;
    width:1024px;
    height:768px;
    margin:auto;
}

...
<body>
     <div id="main">
     ...
     </ div>
</body>
...

問題は、背景画像の一部を当社のWebサイトにクリック可能にしたいということです。私は、position：absolute：を使用してクリック可能にしたい領域の周りに透明なボックスを設定することにより、これを実装しました。

#logo-link 
{ 
        position: absolute; 
        top: 30px; 
        left: 350px; 
        width: 600px; 
        height: 280px; 
        background-color: transparent; 
}

...
<div>
    <a id="logo-link" href="/mylink"></a>
</div>
...

これは、画面にボックスを設定すると機能しますが、他の画面解像度ではボックスが移動することに気付きました。はるかに高い解像度の画面で、ボックスがシフトしてフォームフィールドがブロックされ、私のサイトにサインアップできるようになりました。

スプラッシュページのクリック可能な領域の実装が不十分だと思いますが、もっとうまくやる方法を教えていただけますか？

ありがとう。

4

1 に答える 1

1

[ライブデモ][1] ...................................こんにちは定義**#main** position:relative;

このように

#main{
position:relative;
}

[ライブデモ][2]

于 2012-09-27T07:00:51.130 に答える