在css中設置圖片寬高適應不拉伸的方法:1.首先,創建img標簽,插入圖片;2.通過position屬性設置fixed樣式固定圖片;3.使用width和height屬性設置圖片寬高為100%即可;
在css中設置圖片寬高適應不拉伸的方法
1.首先,在頁面中創建一個img標簽,并插入圖片;
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<style></style>
</head>
<body>
<img src="1.jpg">
</body>
</html>
2.圖片添加好后,在css中使用position屬性固定圖片;
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<style>
img{
position: fixed;
}
</style>
</head>
<body>
<img src="1.jpg">
</body>
</html>
3.最后,圖片固定好后,使用width和height屬性設置圖片寬高為100%即可實現圖片的寬高適應不拉伸;
<!DOCTYPE html><html>
<head>
<meta charset="utf-8" />
<style>
img{
position: fixed;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<img src="1.jpg">
</body>
</html>