html css 图像 crop,html - CSS crop an image with the same quality - Stack Overflow

At the moment I create a little upload page. On the page you can upload your image. Here is the link: MyPage. Now I want to crop the image, but I want see more if the image and not only a little piece like now. This page is a very good example: Page. One more negative point is the quality, I think the quality is even worse.

Here are the two pictures on the example page: picture if you look on the square over the real version with the same image it looks much better as on my page. And here is the other image: picture. I hope you understood me.

Here is my Code:

*{

margin: 0px;

padding: 0px;

}

.button-submit{

margin-top: 10px;

padding: 10px 15px;

border: 2px solid black;

background-color: orange;

color: black;

transition: all 0.5s;

}

.button-submit:hover{

color: orange;

border: 2px solid orange;

background-color: black;

}

.image{

object-fit: none; /* Do not scale the image */

object-position: center; /* Center the image within the element */

height: 128px;

width: 128px;

}

Lade dein Bild hoch

$sql = "SELECT * FROM bilder";

$result=mysqli_query($db,$sql);

while($row=mysqli_fetch_assoc($result)){

echo "";

}

?>