Question

html 如何让背景图片充满全图，就是拉伸

Answer 1

使用此代码：<img border='0' src='/jpg' width='100%' height='100%' style='position: absolute;left:0px;top:0px;z-index: -1'>或者background-size:cover。

拓展资料

【HTML】

超文本标记语言，标准通用标记语言下的一个应用。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。超文本标记语言的结构包括“头”部分（英语：Head）、和“主体”部分（英语：Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。

【由来】

万维网上的一个超媒体文档称之为一个页面（外语：page）。作为一个组织或者个人在万维网上放置开始点的页面称为主页（外语：Homepage）或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接）。

所谓超级链接，就是一种统一资源定位器（Uniform Resource Locator，外语缩写：URL）指针，通过激活（点击）它，可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。

在逻辑上将视为一个整体的一系列页面的有机集合称为网站（Website或Site）。超级文本标记语言（英文缩写：HTML）是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。

网页的本质就是超级文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。

因而，超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点。

参考资料：百度百科--HTML

Answer 2

1. 原理：由于给网页设置背景图时，需要设置背景图不重复且充满整个浏览器屏幕，给body标签指定背景图，这样背景图就可以填充整个浏览器viewport了。其实，该方案对所有的块级容器都可以生效。块级容器的宽高是动态的，那么背景图将自动伸缩，充满整个容器。

2. 可设置body标签的CSS样式如下：
body{
/*加载背景图*/
background-image：url（./images/background.jpg）;
/* 背景图垂直、水平均居中 */
background-position: center center;
/* 背景图不平铺 */
background-repeat: no-repeat;
/* 当内容高度大于图片高度时，背景图像的位置相对于viewport固定 */
background-attachment: fixed;  //此条属性必须设置否则可能无效/
/* 让背景图基于容器大小伸缩 */
background-size: cover;
/* 设置背景颜色，背景图加载过程中会显示背景色 */
background-color: #CCCCCC;
}

3. 或简写为如下CSS样式：
body{
background:url(./images/background.jpg)  no-repeat center center;
background-size:cover;
background-attachment:fixed;
background-color:#CCCCCC;
}

Answer 3

html语言背景图片拉伸代码：background-size:cover，可以使图片拉伸铺满背景。

拓展资料

背景 (background) 属性定义元素的背景效果

元素的背景区包括前景之下直到边框边界的所有空间。因此，内容框与内边距都是元素背景的一部分，且边框画在背景上。

CSS 允许应用纯色作为背景，也允许使用背景图像创建相当复杂的效果；CSS 在这方面的能力远远在 HTML 之上。

background 是用于在一个声明中设置所有背景属性的一个简写属性。

格式: background: {属性值}
继承性: NO
可能的值：
background-color
background-image
background-repeat
background-attachment
background-position
新增的值：
background-clip
background-origin
background-size 
注：可以在此声明中声明1到5个背景属性。

这只是 CSS 1.0 的属性，在CSS 2.0 background已经退出了历史舞台。

例：
<style type="text/css">
body
{
background: #ff0000 url('i/eg_bg_03.gif') no-repeat fixed center;
}
</style>

Answer 4

一行代码可解决
background-size:cover
html手册上的:
注意：如果打算使用背景图像，应该牢记：

这个图像会使页面加载时间过长吗？小技巧：图像文件的容量尽量不要超过10K。
这个图像跟页面上其他图像协调吗？
这个图像跟页面上的文字颜色协调吗？
这个图像平铺了以后看起来还可以吗？
这个图像吸引了文字的注意力，喧宾夺主了吗？
一般的网站很少使用背景图像。

Answer 5