0

ボタンの背景画像が必要な場合は、以下のような背景を使用します

#statusButton span {
    color: #445058; 
    font-size: 14px; 
    font-weight: bold; 
    text-shadow: 1px 1px #fff; 
    padding: 7px 29px 9px 10px;
    background: url('../images/Arrow.png') no-repeat 53px 7px;
    display: block;
}

ここに似ています http://www.soundendeavors.com/clients/index.html

このタイプの画像を画像の前景として追加するにはどうすればよいですか。画像に同じ背景属性を使用すると、通常の画像が重なります。必要なのは、前景タイプのcssです。画像の上に画像。

4

2 に答える 2

3

では、ある画像の上に別の画像を置きたいと思いませんか? あなたはこのようにすることができます：

div{      /*You can use whatever element you prefer*/
    width: 400px;
    height: 400px;
    background-image: url('link1.jpg'), url('link2.png');     /*URLs*/
    background-position: left top, right bottom;              /*position*/
    background-repeat: no-repeat;                             /*repeat or not*/
}

速くて簡単。リストの最初の画像が一番上に表示されます。

デモ: http://jsfiddle.net/DerekL/Pdxpe/

この方法の良いところは、ラッパーが浮かんでいるのではなく、まだ 1 つの固体要素があることです。

于 2013-01-01T00:50:59.740 に答える
2

私が理解していれば、そうです、画像の上に別の画像を重ねたいですか？

既存の画像の上に別の画像を重ねる CSS で位置を操作できます。

CSS:

#wrapper {
    position: relative;
}
#img1 {
    position: absolute;
    top: 0;
    left: 0;
    z-index:0;
}
#img2 {
    position: absolute;
    top: 0;
    left: 0;
    z-index:100;
}

HTML:

<div id="wrapper">
  <img src="img1.jpg" id="img1" />
  <img src="img2.jpg" id="img2" />
</div>

値が低いため、idの画像が#img1画像の下にあります...#img2z-index

于 2013-01-01T00:41:35.337 に答える