Можно ли плавать объект над изображением с помощью css? Я хочу поместить форму поверх изображения (это не фон). Float не работает, но есть ли какая-то переменная, которая предоставляет эту функцию?
Когда вы плаваете объект, он перемещает текст по обе стороны объекта. То, что я ищу, - это то, что не будет делать этого, это будет просто плавать без учета того, что находится под ним.
То, что вы ищете, - это не то, что делают плавающие элементы. Плавающий элемент по-прежнему является частью потока документов, и вам нужен элемент, который не является.
Используйте абсолютное позиционирование, чтобы вывести элемент из потока документа, таким образом он не будет удалять другие элементы, и вы можете поместить его поверх других элементов:
<div style="position:relative">
<img src="image.jpg" alt="" />
<div style="position:absolute;left:0;top:0;">
This text is on top of the image
</div>
</div>
Элементы с position:relative действуют как начало для абсолютно расположенных элементов внутри него, поэтому текст помещается поверх изображения, а не в верхний левый угол страницы.
Если вы делаете изображение под вопросом фоновым изображением для таблицы div или (да, я говорю это), используемой для форматирования формы, форма будет "плавать" над изображением.
Если этого недостаточно для ваших нужд, проверьте http://w3schools.com/css/css_positioning.asp
Попробуйте z-index свойство
<html>
<head>
<style type="text/css">
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<img src="w3css.gif" width="100" height="140" />
<p>Because the image has a z-index of -1, it will be placed behind the text.</p>
</body>
</html>