HTML-баннер с наложением изображений и текстов

Question

Я ищу способ динамически создавать баннеры, которые можно разместить на других страницах. Баннер состоит из фонового изображения, двух наложенных изображений и двух текстовых меток поверх этого фонового изображения.

Правильно ли, что я могу использовать только абсолютное позиционирование для наложения элементов? Как я могу убедиться, что баннер самостоятельно размещен относительно интегрированной страницы?

Полагаю, мне нужно иметь возможность размещать элементы абсолютно внутри относительной рамки. Возможно ли это?

Спасибо Markus

Answer 1

Это возможно. Содержащий элемент должен иметь position:relative, а все внутренние элементы, которые вы хотите разместить, должны иметь position:absolute;, а также позиции x и y, например: top:10px; right:20px или bottom:10px; left:230px

Так, например:

CSS:

#banner_wrap {position:relative; width:860px; height:60px;}
#inner_element {position:absolute; top:10px; left:20px; width:40px; height:40px;}

HTML

<div id="banner_wrap">
   <div id="inner_element"></div>
</div>

Если вы хотите, чтобы они были динамическими, вы можете изменить CSS для конкретной страницы.