香港服务器的css如何让图片宽高适应不拉伸

已关闭留言

在香港服务器的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>