leave a responsive image horizontally, but not scaled, but cut horizontally

Asked

Viewed 219 times

3

Good afternoon

How to leave a responsive image, so that it is literally cut in its horizontal, so that you remove the horizontal scrollbar from the page, and do not get a "smashed up appearance"

I thank those who help, follows below an example, the image this responsive, but wanted to remove the effect of "crushing" the image, I want it to be cut, and not resized

<html>

  <head>
  </head>

  <body>
                <img alt="" class="form-image" border="0" src="https://www.jotform.com/uploads/natupote/form_files/SALADA2.png" height="800px" width="100%" />

  </body>

</html>

html css

  • You’ll have to put it as background by CSS

  • Can you teach me the command? I’m a beginner in web-based Prog

1 answer

1


You need to put the image as background of some div:

.img-responsive {
    background: url('http://i.imgur.com/xRxFRSY.jpg') top center;
    width: 100%;
    height: 250px;
}
<div class="img-responsive">
</div>

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.