-7

I'm having a problem. I want my result is image 1 with original image is image 2 use CSS or Bootstrap Thanks all! Image result here

image original

Albert Einstein
  • 7,472
  • 8
  • 36
  • 71
Nguyen Tung
  • 101
  • 2
  • 1
    If you’re here to get help, make it as easy as possible for others to help you. Follow our [guidelines](https://stackoverflow.com/help/how-to-ask) and remember that our community is made possible by volunteers. – Anuresh VP Sep 25 '18 at 04:20
  • 1
    Hi , Welcome to stack overflow .Please take the time to read to see https://stackoverflow.com/help/how-to-ask, We cannot help you if you do not provide any code, can you please put your code – core114 Sep 25 '18 at 04:37
  • 1
    Could you add your code here? Otherwise it is impossible to find the problem. You need to add a Snippet by editing your question. – vishnu Sep 25 '18 at 04:54

2 Answers2

0

Try this. Adjust the colors as you want.

HTML

<div class="box">
  <img src="https://i.stack.imgur.com/0nziL.png">
</div>

CSS

img {
  width: 100%;
  display: block;
}

.box {
  position: relative;
}

.box::after {
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, 
    rgba(56, 103, 214,0.4) 0%, 
    rgba(19, 15, 64,0.7) 50%);
}

Demo https://jsbin.com/fetoyubapo/edit?html,css,output

Amir Ur Rehman
  • 649
  • 1
  • 9
  • 28
-1

Take a look at this fiddle: https://jsfiddle.net/u85eorcm/

body {
  background:linear-gradient(90deg, rgba(17,50,80,0.5) 100%, rgba(60,72,116,0.5) 50%), 
    url("https://i.stack.imgur.com/xsQv6.png");
}

I'd recommend googling your questions firstly before asking StackOverflow next time!

Hope this helps.

2pacalypse
  • 65
  • 2