-1

シンプルなページ (HTML と CSS のみを使用) を作成しようとしていますが、いくつかの要素で問題が発生しています。達成したいことと行ったことのリンクをここに添付しました。

質問は:

1. ピンクの背景をすべてのテキストと画像に重ねるにはどうすればよいですか?

  • 私はCSSでこれをやろうとしました:

    #setBackground {
    position:absolute; left:0px; top:0px; z-index:-1;
    }

  • そしてHTMLで：

    <div id="setBackground">
    <img src="/images/pinkbg.png" alt="Background"/> </div>

  • しかし、それでもうまくいきませんでした。

私はそれが空想的ではないことを知っていますが、誰かが私にいくつかの提案を与えることができれば、非常に感謝しています. ありがとう。

4

2 に答える 2

0

  1. css ファイルで z-index 構文を使用する

  2. それがイメージです。または、css3 で試すこともできます...( www.w3schools.com )

  3. 'box' などの名前の div ボックスを css ファイルに作成します。

    ＃箱 {
 位置: 絶対;
 幅: 100%;
 高さ: 20px;
 背景色: 赤;
 }

4.

position: absolute;
width: 100px; 
height: 100px;
top: 200px;
left: 50px;
background-color: black; (example... works with % instead of px, too)

5.

margin: right; (CSS works only if your text is in a div-box)

幸運を

于 2013-05-18T23:11:20.647 に答える
0

ピンクは重なっていませんが、underneath透明なものを上に置くと下のピンクが見えるようになっています。この場合、ピンク色を設定するには

 background-color: rgb(245,195,195);

背景をレイアウトする方法の例を次に示します: http://jsfiddle.net/EAHQw/6/

追加のコンテンツはすべてこれら 2 つの div 内に配置されるため、上に配置され、目的のピンク色の背景が与えられます。

私は行って、より完全な例を作成しました。http://jsfiddle.net/GEwYJ/2/

円をごまかしていることがわかりますが、その画像は、3D 回転をサポートする画像編集プログラムで簡単に作成できます。あなたはおそらく純粋なcssでそれを行うことができますが、私はそのための変換には十分ではなく、画像だけで行う方がおそらく簡単でしょう. また、箱に収まりやすいように小さくしました。これは完全なコピーではありませんが、近似として合格する可能性があります。

また、スタイルを適用するさまざまな方法を示すために、クラス名 ID と疑似セレクターを組み合わせて使用​​しました。本番環境では、より一貫した構造を持つ方がよいでしょう。

于 2013-05-19T00:32:08.497 に答える