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

时间:2013-10-25 15:26:27

标签: html css image tracing

我不知道在哪里寻找这样的东西。基本上我有这样的想法,如果你可以将photoshop设计作为半透明的背景并在其上构建。使用图像作为指导,几乎像跟踪。通过这种方式,可以轻松排列。我相信microsoft表达式(如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%;
}

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

2 个答案:

答案 0 :(得分:1)

如果您使用的是Chrome,则可以尝试PixelPerfect扩展程序:

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

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

答案 1 :(得分:1)

自2000年以来,Dreamweaver已经有了一个跟踪图像选项。

我不会因为任何其他原因推荐DreamWeaver,但这个特殊功能,它有。

如果不这样做,在上面的代码中添加pointer-events: none会很好,因为这样您就可以与浏览器进行互动而不会覆盖所有控件的图片覆盖。