css设置一张图怎么拉伸填满整个窗口

html-css023

css设置一张图怎么拉伸填满整个窗口,第1张

css设置一张图拉伸填满整个窗口，我们可以通过给这个图片设置width，height都给他们100%的高度和宽度，然后在就能看到填满全屏了，举个例子：

<html>

<head>

<style>

.class{

width:100%//通过class来控制

height:100%

}

</style>

</head>

<body>

<div id='content'>

<div class='img'>

<img src='图片地址'>

</img>

</div>

</body>

</html>

1、打开操作软件这里用DW，定义一个css样式，如下图

2、首先看下，背景图效果，如下图所示：

3、在div中添加一个img，输入以下代码。如下图所示：

4、即可实现如题，css图片之上再加一张图片：如下图所示：

下面是图片不失真但不保证是否完全铺满（留有空隙或者超出屏幕）的css代码：

1、横向铺满，纵向留有空隙或超出屏幕：

body {background:url(图片路径) no-repeat centerbackground-size:100% auto}

2、纵向铺满，横向留有空隙或超出屏幕：

body {background:url(图片路径) no-repeat centerbackground-size:auto 100%}

补充说明：background-size属于css3，只有支持css3的浏览器才有效。

电脑（Computer）是一种利用电子学原理根据一系列指令来对数据进行处理的机器。电脑可以分为两部分：软件系统和硬件系统。第一台电脑是1946年2月15日在美国宾夕法尼亚大学诞生的ENIAC通用电子计算机。

人们把没有安装任何软件的计算机称为裸机。随着科技的发展，现在新出现一些新型计算机有：生物计算机、光子计算机、量子计算机等。