Помощник
|
Наложение изображения |
Furin
|
Сообщение
#1
|
||
|
|
||
|
|||
artanik |
23.6.2011, 15:50;
Ответить: artanik
Сообщение
#2
|
|
Можно, с помощью интересного свойства position и z-index.
<div id="relative"> <div id="absolute1"></div> <div id="absolute2"></div> </div> #relative { position:relative;/*то есть все дочерние элементы будут позиционироваться относительно этого*/ width:100px; height:300px; border:1px sold #000;/*это для большей наглядности*/ } #absolute1 { position:absolute; z-index:1;/*нижний слой*/ width:100px; height:300px; background:url(image1.png) transparent; } #absolute2 { position:absolute; z-index:2;/*верхний слой*/ width:100px; height:300px; background:url(image2.png) transparent; } Можно играться с margin, для достижения большей точности. Важно что бы картинка была в формате PNG или GIF. Но PNG криво отображаеться в ИЕ6, а GIF поддерживает всего лишь 255 цветов. -------------------- Нужна качественная вёрстка сайтов? Обращайтесь: ICQ 555-177-362 |
|
|
Furin
|
Сообщение
#3
|
|
Можно, с помощью интересного свойства position и z-index. Можно играться с margin, для достижения большей точности. Важно что бы картинка была в формате PNG или GIF. Но PNG криво отображаеться в ИЕ6, а GIF поддерживает всего лишь 255 цветов. Спасибо, действительно, помогло. Но.. =) Кнопка аудио плеера, который находится под картинкой, стала не активной.. Вообще не нажимается. |
|
|
Kostap13 |
23.6.2011, 18:21;
Ответить: Kostap13
Сообщение
#4
|
|
Спасибо, действительно, помогло. Но.. =) Кнопка аудио плеера, который находится под картинкой, стала не активной.. Вообще не нажимается. Скорее всего один из блоков её перекрыл. Откройте страницу в хроме, правой кнопкой по проблемному участку - анализировать элемент. Далее изучайте кто кого перекрыл. |
|
|
artanik |
23.6.2011, 19:53;
Ответить: artanik
Сообщение
#5
|
|
кнопке напиишите свойства
#button { position:relative; z-index:3; height:100px; width:300px; } <div id="relative">
<div id="absolute1"></div> <div id="absolute2"></div> <div id="button"></div> </div> -------------------- Нужна качественная вёрстка сайтов? Обращайтесь: ICQ 555-177-362 |
|
|
S1xteen |
23.6.2011, 20:06;
Ответить: S1xteen
Сообщение
#6
|
|
Не уверен, но можно ещё попробовать так:
<div id="class"><img src="/img.jpeg" /></div>
#class{ background:url(img.png) no-repeat; width:100px; height:100px; } |
|
|
oldzas |
24.6.2011, 10:45;
Ответить: oldzas
Сообщение
#7
|
|
|
1) берутся 2 картинки в png с прозрачным фоном
2) накладываются дивами друг на друга ( позиционирование ) потом z-index устанавливается кто сверху а кто дразниться
|
|
|
||
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
Изображения с shutterstock от 15 рублей/штука | 5 | Mr_Big | 3670 | 10.9.2017, 21:30 автор: Palundra |
|
Вывод изображения при наведения на часть картинки по area | 1 | androv77 | 4843 | 16.7.2016, 17:32 автор: -YroKPROG- |
|
Создаю фрактальные изображения для разных целей | 22 | Russ33 | 5074 | 27.6.2016, 21:42 автор: Russ33 |
|
Стоковые изображения для ваших сайтов по цене 3х рублей | 51 | contextadlinks | 14394 | 21.10.2014, 17:28 автор: VulkanPartner |
|
Изменения изображения | 2 | igorvolg | 1053 | 22.6.2013, 20:13 автор: igorvolg |
Текстовая версия | Сейчас: 24.4.2024, 17:42 |