Lý thuyết object-fit
RUN
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Object Fit</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> body { display: flex; justify-content: center; align-items: center; } div { margin: 30px; display: inline-block; } img { background-color: aqua; } .obf { object-fit: cover; } </style> </head> <body> <div> <div> <p>Origin image</p> <img width="400px" height="300px" src="https://freetuts.net/upload/tut_post/images/2019/03/11/1670/anh2.jpg"> </div> <div> <p>Object-fit use</p> <img class="obf" width="400px" height="300px" src="https://freetuts.net/upload/tut_post/images/2019/03/11/1670/anh2.jpg"> </div> </div> </body> </html>
PHÓNG TO