E
E
Elizabeth2017-07-19 19:56:22
css
Elizabeth, 2017-07-19 19:56:22

How to add an image to an image?

On top of each block, you need to add such a highlight:
3f7db909ef2c4f86a02bb4c0f60ed920.png
the markup code itself

<div class="col-md-3 col-sm-4 col-xs-6 mini_post">
                    <img src="img/Italy.jpeg" class="img-responsive img_mini_post" alt="Responsive image">
                    <div class="mini_post_text">
                        Italy<br/>
                        <span class="mini_post_price">from $1,050</span>
                    </div>
                </div>

Is it possible to do this with css, maybe overlay svg somehow? Or do I need to manually process each image in Photoshop?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
P
PiggyPig, 2017-07-20
@elizaveta_kotik

<div class="col-md-3 col-sm-4 col-xs-6 mini_post">
    <!-- Бликовая картинка -->
    <img src="img/reflect_light.png" class="reflect_light">
    <!-- Обычная картинка -->
    <img src="img/Italy.jpeg" class="img-responsive img_mini_post" alt="Responsive image">
        <div class="mini_post_text">
            Italy<br>
            <span class="mini_post_price">from $1,050</span>
        </div>
</div>

.mini_post {
    position: relative;
}

.reflect_light {
    position: absolute;
}

Z
zRrr, 2017-07-19
@zRrr

Here

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question