在html中将插入背景图片,如何让背景图片跟屏幕一样大?

html-css015

在html中将插入背景图片,如何让背景图片跟屏幕一样大?,第1张

方法:首先点击【新建文件夹】,放入背景图片,在Dreamweaver CS6中点击【新建一个html空白文档】,.将页面内容放入<body></body>中,在<body后按一下空格键,找到background,再按空格,点击【浏览】,选中背景图,点击【确定】,将html另存为在“表格”文件夹里。这样就可以让背景图片跟屏幕一样大。

您好!很高兴为您解答问题,以下是我为您提供的解答内容:

新建一个html文档。

设置一下HTML的框架,然后把图片设置在同一个文件夹里面。

加入,这样可以有样式设置。

因为背景设置在主体,所以还要定义为body{}。

background-image:url(图片),这个是添加图片的意思。

然后我们需要加入background-repeat:repeat-x这个时候就会横向平铺。

1、在body设置 <body background="背景图.jpg">,但是图片是平铺。

2、因为background属性不能拉伸图片,只能用个div,把其z-index值设为负,并使这个div大小为整个body大小,在div里用<img>,其中z-index:-1为了让该div在最下层,也就是背景。

示例:

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />

<title>背景全屏</title>

<style type="text/css">

body{

margin:0px

padding:0px

}

.d1{

position:absolute

left:0px

top:0px

width:100%

height:100%

z-index:-1

}

</style>

<body>

<div class="d1"><img src="背景图.jpg" width="100%" height="100%"/></div>

<center>

<h1>这是全屏图片</h1>

<h1>这是全屏图片</h1>

<h1>这是全屏图片</h1>

<h1>这是全屏图片</h1></center>

</body>

</html>