You've got 2 options, and both maintain the image ratio:
Option 1
background: url(yourimage.jpg) no-repeat center center / cover;
The last part is the background-size: cover
property. It will make the background image zoom in depending on the browser width, to make sure it fills the whole div.
Example: https://i.sstatic.net/xnhev.png
Option 2
background: url(yourimage.jpg) no-repeat center center;
It's the same effect but without the zoom in part. The background will keep its aspect and remain centered, but if your browser width is bigger than your image width (in this case, 1500px), you'll see the background-color (in this case white).
Example: https://i.sstatic.net/NpXBK.png
I recommend option 1. You only see the zooming effect if you resize your browser but almost nobody does, and the visitor will only see a filled background.