1

div にスライダーがあり#slidesます。

<div id="slides">
          <img src="img/slide-1.jpg" />
          <img src="img/slide-2.jpg" />
          <img src="img/slide-3.jpg" />
          <img src="img/slide-4.jpg" />
    </div>

#slides { display: none; position:relative; }

いくつかのテキストを示すスライド画像内にdiv を配置したいのですが.slide-helpext、どのように div を配置すればよいですか?

.slide-helpext
{
    position:absolute;
    top:30%;
    left:60px;

}

編集:スライド div を以下のように配置しました。

<div id="slides">
          <img src="img/example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/">
          <div class="slide-helpext">1</div>
          <img src="img/example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/">
          <div class="slide-helpext">2</div>
          <img src="img/example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/">
          <div class="slide-helpext">3</div>
          <img src="img/example-slide-4.jpg" alt="Photo by: Stuart SeegerLink: http://www.flickr.com/photos/stuseeger/97577796/">
          <div class="slide-helpext">4</div>
    </div>

しかし、数字をスライドさせてから画像をスライドさせます。たとえば、空白の画面を 1 にしてから、対応する画像をスライドさせます。

4

2 に答える 2

0

その隣に配置し、画像に重なるようにマイナスの余白を付けます。実際には他の要素を画像内に階層的に配置することはできませんが、そのように見せることはできます。

<div id="images">
    <img src="image.png" />
    <div class="text">Title</div>
</div>

CSS:

.text {
    margin-top: -30px;
    height:30px;
}
于 2013-06-20T07:31:42.443 に答える