html 怎么让img自适应div大小_随笔

使html中div内的图片随屏幕大小调节的 *** 作方法为，将div与img的宽度都设置为100%，代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<title>图片大小自适应</title>

div,img{ width:100%}

</style>

</head>

<body>

<div>

</div>

</body>

</html>

效果图如下：

特别说明：

要图片跟随屏幕大小显示，可以将图片与div的宽度调整为100%，并且body不设置宽度（或者也设置为100%），在使用不同屏幕浏览网页时，图片将自动铺满屏幕。

有用记得采纳

可以用“width”和“height”属性控制图片的显示大小。

1、新建html文件，在body标签中添加img标签，为img标签设置“src”属性，属性值为图片的地址，这时图片的显示大小是图片自身的大小：

2、为img标签单独设置“width”或“height”属性，属性值为宽度或者高度，这时图片的宽度将变成设置的宽度，高度将会按原比例进行缩放：

3、同时为img标签设置“width”和“height”属性，这时图片的大小将会完全按照设置的大小显示：

你好，可以使用背景图片，比如把img作为body的背景图，然后设置body的样式

background: #226039 url(../images/bg.jpg) center no-repeat

就可以使图片100%显示，且不会拉伸，具体参数你可以查background的具体属性

希望可以帮助到你

欢迎分享，转载请注明来源：内存溢出

html 怎么让img自适应div大小