html 怎么让img自适应div大小

html-css09

html 怎么让img自适应div大小,第1张

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

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

 

<html xmlns="

 

<head>

<meta http-equiv="Content-Type" content="text/html charset=utf-8" />

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

<style type="text/css">

div,img{ width:100%}

</style>

</head>

<body>

    <div>

    <img src="20150930010349.jpg" />

    </div>

</body>

</html>

效果图如下:

特别说明:

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

有用记得采纳

如果通过css设置背景图,那么图片尺寸要足够大,目前大宽屏1920左右,所以宽度最好设置为1920,然后居中;如果通过div嵌入图片,那么将此div设置成绝对定位,z-index:-1。

万维网上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外语:Homepage)或首页,主页中通常包括有指向其他相关页面或其他节点的指针(超级链接),所谓超级链接,就是一种统一资源定位器(UniformResourceLocator,外语缩写:URL)指针,通过激活(点击)它,可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。在逻辑上将视为一个整体的一系列页面的有机集合称为网站(Website或Site)。超级文本标记语言(英文缩写:HTML)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。

网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。