упорядочение и упорядочение слоев css

Question

Я пытаюсь иметь один слой и центрировать изображения внутри. Т.е., если у меня есть 3 изображения и мне нужно 3 ссылки под ними, есть ли способ сделать это без использования отдельного тега div для каждой ссылки и изображения? Чтобы автоматически сделать ссылки центрированными под изображениями, а изображения должны быть равномерно распределены внутри слоя?

Мне также было интересно, как я мог бы сделать показ div за стандартным html, если это возможно. И.Е. если у меня есть текст и div над текстом, div будет отображаться по умолчанию над текстом, когда я бы хотел, чтобы он был позади. Это возможно только при использовании другого слоя?

Answer 1

Да, вам нужно будет поместить элемент контейнера, такой как div, вокруг каждого изображения и его заголовка, чтобы они были вместе.

<div class="pictureBox">
    <div>
        <img />
        caption caption
    </div>
    <div>
        <img />
        more caption
    </div>
</div>
--------
.pictureBox div {
    text-align: center;
    /* whatever width/height/positioning you want */
}

Для второй части вопроса, касающейся его размещения за другим текстом, взгляните на CSS z-index , хотя я думаю, что это относится только к абсолютно позиционированным элементам.

Answer 2

ник прав, z-index применяется только к абсолютно позиционированным элементам.

Вы можете сделать положение содержащего элемента: относительным, а затем указать и изображение, и положение ссылки: абсолютное, чтобы повлиять на порядок их размещения.