Fatal编程技术网

Javascript HTML分层框架

javascript html css

Javascript HTML分层框架,javascript,html,css,Javascript,Html,Css,我正在尝试使用HTML层进行训练。就我对图层的研究而言，我能够使用Z索引概念将文本和图像作为图层。但是，我希望帧作为层插入。例如，在gmail中，背景图像是恒定的，邮件列表将上下滚动。我不明白这是怎么发生的 我使用了以下代码来分层文本和图像- <html> <head> <title>layers example</title> </head> <body><layer id="layer1" top="250" le

我正在尝试使用HTML层进行训练。就我对图层的研究而言，我能够使用Z索引概念将文本和图像作为图层。但是，我希望帧作为层插入。例如，在gmail中，背景图像是恒定的，邮件列表将上下滚动。我不明白这是怎么发生的

我使用了以下代码来分层文本和图像-

<html>
<head>
<title>layers example</title>
</head>
<body><layer id="layer1" top="250" left="50" width="200" 
    height="200" bgcolor="red" src="http://www.bing.com">
  <p>layer 1</p>
</layer>
<layer id="layer2" top="350" left="150" width="200" 
    height="200" bgcolor="blue" src="http://www.google.com">
  <p><a href="http://www.google.com/">layer 2</a></p>
</layer>
<layer id="layer3" top="450" left="250" width="200"
    height="200" bgcolor="green" src="http://www.yahoo.com">
  <p>layer 3</p>
  <div style="position:relative; font-size:50px; z-index:1;"><img src="http://t2.gstatic.com/images?q=tbn:ANd9GcQ6J6SpArkOxpmJnTYWEhpHVBblK6QaEklttBWfamorUYuMCob42A"></div>
 <div style="position:relative; top:-50; left:5; color:red; font-size:80px; z-index:2"><img src="http://t1.gstatic.com/images?q=tbn:ANd9GcTZc0IWj3c3KTndAIy7-3SHhuur4z3Dzufa31xQf4csrZmDvm-e0A"></div>
 <div style="position:relative; top:-50; left:5; color:red; font-size:80px; z-index:2"><img src="http://t2.gstatic.com/images?q=tbn:ANd9GcRvqc6p-sUKBtmYUrp4tIGqjXfXOGExoGkpZvLxTPcVGZRMc4iN"></div>
 <div id="Layer1" style="position:absolute;width:300px;height:75px;left:54px;background-color:green"><b>This is layer1</b></div>
 <div id="Layer2" style="position:absolute;width:200px;height:65px;left:54px;background-color:orange;border:1px"><b>This is layer2</b></div>
</layer>
</body>
</html>


图层示例
第一层



第三层

这是第一层
这是第二层
如果有人对此有想法，请与我分享

提前谢谢。

固定背景不需要图层。您可以将其设置为您的身体：

body {
     background: #000000 url(image.jpg) top center no-repeat fixed;
}
如何使用背景：无重复滚动0 0透明；谢谢你的回复。但是，我应该在我的代码中插入到哪里呢？在你的css文件中，如果你想在某些特定的div中使用背景图像，请在你的类中添加这个，或者你可以在body中使用它…谢谢你的回复。现在我明白了！ 
body {
     background: #000000 url(image.jpg) top center no-repeat fixed;
}