Позиционирование фоновых изображений страницы

Question

У меня есть два изображения, одно изображение с размером 1800 X 1140 и другое изображение с затуханием размера 1 X 1140. Мне нужно объединить эти два изображения так, чтобы первое изображение приходилось на половину и второе изображение должно быть похоже на градиент, который затухает в первом изображении. Я реализовал divs следующим образом.

<div style="background:url('first-img.png') no-repeat fixed top center transparent;"> 
    <div style-"background:url('second-img.png') repeat fixed bottom center transparent;"> 

    </div> 
</div> 

Answer 1

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

<div style="background:url('first-img.png') no-repeat fixed center top transparent;"> 
    <div style-"background:url('second-img.png') repeat fixed center top transparent;"> 

    </div> 
</div> 

, а также добавить точная ширина и высота для ДИВ-х

Answer 2

эй теперь вы можете определить позицию относительного и абсолютного, как, как это

Define your parent postion relative and child define absolute 

Css

.parent{ 
position:relative; 
    width:500px; 
    height:200px; 
    border:solid 1px green; 
    background:url('first-img.png') no-repeat fixed top center transparent; 
} 




.child{ 
position:absolute; 
    top:0; 
    left:0; 
    right:0; 
    bottom:0; 
    border:solid 2px red; 
    background:url('second-img.png') repeat fixed bottom center transparent; 
} 

HTML

<div class="parent"> 
     <div class="child"> 
    ------- 
     </div> 
    </div> 

Изменение ширины и высоты в зависимости от вашего дизайна ...