наложение блоков - HTML и CSS

vedro-compota · 24.04.2010, 12:05

Как можно сделать так, чтобы один блок, появлялся поверх содержимого другого( не поверх фона, а поверх уже размещённой картинки) . Например вот есть два дива, вложенные один в другой:

Код:

#fone {  
       width: 1024px ;  
         height: 1500px ;  
        }
#message { position: relative;
          top: 48px;
          left: 75px;
           width: 688px ;  
           height: 392px ; }

код страницы:

Код:

<div> <img src="fone2.jpg" id="fone"> 
<div id="message"> <img src="message.jpg" id="fone"> </div>
</div>

Дело в том, что картинка fone2.jpg применяется как фон (растянутый градиент- который не был признан таковым Magento )) поэтому я не могу просто спользовать для внешнего div--а свойство background image))
вот такие дела, подскажите пожалуйста ))

uberchel · 24.04.2010, 12:59

Вроде так вам надо было:

Код HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>ТЕСТ</title>
<style type="text/css">
body {
 margin:0px; 
 padding:0px;
}

#fone {  
 width: 100%;  
 height: 100%; 
 background: url('1.bmp') center no-repeat;
 }
 
#message {
 width: 680px;  
 height: 390px;
 padding:50px;
}
</style>
</head>
<body>
<div id="fone"> 
<div id="message"><img src="2.bmp" width="100%" height="100%" border="0" alt="" /></div>
</div>
</body>
</html>

vedro-compota · 24.04.2010, 16:15

но ведь можно же заставить один блок закрывать содержимое другого , даже если содержимое - не фон?
да и не получиться мне с фоном))

Цитата:

#fone {
width: 100%;
height: 100%;
background: url('1.bmp') center no-repeat;
}

картинка 1.bmp- это сжатый градиент ( чтобы весила меньше) я его потом уже потом растягивает браузер......поэтом код такой не подходит ( особенно если "no-repeat" ) )

dr.Chas · 24.04.2010, 22:07

Код HTML:

#fone {  
       width: 200px ;  
         height: 300px ;
         z-index: 0;  
        }
#message { position: absolute;
          top: 0px;
          left: 75px;
           width: 88px ;  
           height: 92px ; 
           z-index: 1;}

ну что то в этом роде, если я правильно понял. Про свойство z-index почитай.

vedro-compota · 25.04.2010, 15:43

ага)) спасибо)

Magneto · 25.04.2010, 17:26

P.S. http://programmersforum.ru/showpost....23&postcount=8

24.04.2010, 12:05	#1
vedro-compota любитель-далеко не Участник клуба Регистрация: 13.04.2010 Сообщений: 1,156	наложение блоков Как можно сделать так, чтобы один блок, появлялся поверх содержимого другого( не поверх фона, а поверх уже размещённой картинки) . Например вот есть два дива, вложенные один в другой: Код: `#fone { width: 1024px ; height: 1500px ; } #message { position: relative; top: 48px; left: 75px; width: 688px ; height: 392px ; }` код страницы: Код: `<div> <img src="fone2.jpg" id="fone"> <div id="message"> <img src="message.jpg" id="fone"> </div> </div>` Дело в том, что картинка fone2.jpg применяется как фон (растянутый градиент- который не был признан таковым Magento )) поэтому я не могу просто спользовать для внешнего div--а свойство background image)) вот такие дела, подскажите пожалуйста )) против абортов=за + жизнь;.фкн вгу;_______________________мойблг

24.04.2010, 22:07	#4
dr.Chas *** Участник клуба Регистрация: 30.07.2007 Сообщений: 1,162	Код HTML: #fone { width: 200px ; height: 300px ; z-index: 0; } #message { position: absolute; top: 0px; left: 75px; width: 88px ; height: 92px ; z-index: 1;} ну что то в этом роде, если я правильно понял. Про свойство z-index почитай. profdev

25.04.2010, 15:43	#5
vedro-compota любитель-далеко не Участник клуба Регистрация: 13.04.2010 Сообщений: 1,156	ага)) спасибо) против абортов=за + жизнь;.фкн вгу;_______________________мойблг

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
ASSEMBLER Копирование блоков	Paco de lucia	Помощь студентам	6	17.04.2010 23:22
Вывод блоков в ряд	Funstarter	HTML и CSS	5	23.11.2009 14:05
Разделители блоков кода	Levsha100	Свободное общение	11	14.10.2009 17:54
Высота блоков.	Grind	HTML и CSS	1	23.10.2008 21:37
Обмен блоков в массиве	Irik	Помощь студентам	6	29.04.2007 14:08

25.04.2010, 17:26	#6
Magneto Форумчанин Регистрация: 10.02.2008 Сообщений: 178	P.S. http://programmersforum.ru/showpost....23&postcount=8