网站建设技术，背景中放置图像，跟踪图像

Question

我不知道到哪里去找这样的东西。基本上，我的想法是，如果你可以把photoshop的设计作为一个半透明的背景，并建立在它之上。使用图像作为向导，几乎就像跟踪一样。这样就可以很容易地把事情排成一行。我相信微软的expression (像dreamweaver)在http://msdn.microsoft.com/en-us/library/cc295031.aspx中有一个类似的特性。为了满足我的需要，我在代码的底部创建了一个div，并给它提供了一些css，如下所示。

#guide {
background-image: url('/BRSS_hm-V3.jpg');
background-position: top;
height: 1500px;
opacity: .20;
position: absolute;
top: 0;
z-index: 1;
width: 100%;
}

我想知道是否其他人正在做类似的事情，如果是的话，他们会推荐什么。还有，有没有更好的方法来做到这一点？

Answer 1

如果你使用的是Chrome，你可以试试PixelPerfect扩展：

https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi

(我认为Firefox也有一个扩展，同名)

Answer 2

从2000年开始，Dreamweaver就有了一个跟踪图像选项。

我不会因为其他原因推荐DreamWeaver，但这个特别的功能，它已经。

如果做不到这一点，最好将pointer-events: none添加到上面的代码中，因为这样您就可以与浏览器进行交互，而无需覆盖所有控件的图像。